﻿
/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                        iprotus.com / iprotus.eu / iprotus.ch                         **
**                                   CSS Stylesheet                                     **
**                                                                                      **
**                             Copyright 2011-2014 iProtus                              **
**                               http://www.iprotus.com                                 **
**                                                                                      **
******************************************************************************************
**                                                                                      **
**                              Thanks particularly to:                                 **
**                                                                                      **
**              Shay Howe, http://learn.shayhowe.com/html-css/box-model                 **
**                           for an excellent primer on CSS,                            **
**                                                                                      **
**            Chris Coyier on @media types in CSS3 to make CSS responsive               **
**                    https://css-tricks.com/css-media-queries/                         **
**                                                                                      **
**     Inayaili de Leon for pointing out the finer details of CSS selectors, here:      **
**    http://coding.smashingmagazine.com/2009/08/17/taming-advanced-css-selectors/      **
**                                                                                      **
**           Noah Stokes, http://alistapart.com/article/css-positioning-101             **
**        for cutting a few basics out in an informative and entertaining way,          **
**                                                                                      **
**                    and to W3C for their excellent validators:                        **
**                     CSS: http://jigsaw.w3.org/css-validator/                         **
**                         HTML: http://validator.w3.org/                               **
**                                                                                      **
**               Mobile optimization guides: https://varvy.com/mobile/                  **
**               and https://varvy.com/mobile/legible-font-size.html,                   **
**               also https://viljamis.com/2012/scaling-with-em-units/                  **
**                                                                                      **
**      And last but not least, this invaluable info on measuring HTML elements         **
**          http://msdn.microsoft.com/en-us/library/hh781509(v=vs.85).aspx              **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/

/*****************************************************************************************
**                                     CSS reset                                        **
*****************************************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video				{margin: 0; border: 0; padding: 0; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer,
header, hgroup, menu, nav, section						{display: block;}
body													{line-height: 1;}
ol, ul													{list-style: none;}
blockquote, q											{quotes: none;}
blockquote:before, blockquote:after, q:before, q:after	{content: ''; content: none;}
table													{border-collapse: collapse; border-spacing: 0;}

/* Stretch viewport to full width and float transparent scrollbars above the rendered page. */
/*@-webkit-viewport	{width: device-width;}
@-moz-viewport		{width: device-width;}
@-ms-viewport		{width: device-width;}
@viewport			{width: device-width;}
*/

/* Media scaling (inspired from https://viljamis.com/2012/scaling-with-em-units/ */
*									{margin: 0; border: 0; padding: 0;}
html								{min-width: 300px;}
body								{font-size:  80%;}		/* Default */
@media (min-width:  400px)	{body	{font-size:  80%;}}
@media (min-width:  600px)	{body	{font-size:  90%;}}
@media (min-width:  900px)	{body	{font-size:  95%;}}
@media (min-width: 1300px)	{body	{font-size: 100%;}}
@media (min-width: 1800px)	{body	{font-size: 110%;}}
@media (min-width: 2400px)	{body	{font-size: 120%;}}

/*****************************************************************************************
**                                  General priming.                                    **
** Textalign in DIV and BODY in order to cope with old browsers not centering properly. **
**       See http://www.maxdesign.com.au/presentation/center/ and a thanks to him.      **
**                 Includes (now possibly redundant) old priming styles.                **
** Font-size from http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/ **
*****************************************************************************************/

body
{
	color: #AAAAAA;
	background-color: #222222;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	cursor: default;
	line-height: 1.2;		/* Do not use a unit here, see https://developer.mozilla.org/en-US/docs/CSS/line-height */
}
div		{text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif;}
table	{text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif;}
td		{text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif;}

/*****************************************************************************************
**                               Text and formatting                                    **
*****************************************************************************************/

h1	{font-weight: bold;		font-size: 2em;}
h2	{font-weight: bold;		font-size: 1.7em;}
h3	{font-weight: bold;		font-size: 1.5em;}
h4	{font-weight: bold;		font-size: 1.3em;}
h5	{font-weight: bold;		font-size: 1.2em;}
h6	{font-weight: bold;		font-size: 1.1em;}
p	{font-weight: normal;	font-size: 1.0em;}

/*****************************************************************************************
**                                Tables and lists                                      **
*****************************************************************************************/

table	{margin: 0; padding: 0;}
tr		{margin: 0; padding: 0;}
th		{margin: 0; padding: 0;}
td		{margin: 0; padding: 0;}

/*****************************************************************************************
**                                Links and related                                     **
*****************************************************************************************/

a:link
{
	color: #DDDDDD;
	text-decoration: underline;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
a:active	{color: #FFFFFF;}
a:visited	{color: #DDDDDD;}
a:hover		{color: #FFFFFF;}

/*****************************************************************************************
**                                      Misc.                                           **
*****************************************************************************************/

.Hr					{left: 2px; right: 2px; height: 1px; display: block; border-width: 1px 1px 1px 1px; margin: 15px 2px 15px 2px; clear: both; border-color: #777777; background-color: #777777;}
.Bold				{font-weight: bold;}
.Italic				{font-style: italic;}
.Underline			{text-decoration: underline;}
.TableCell			{display: table-cell;}
.TableCellCenter	{text-align: center; vertical-align: middle;}
.TextHCenter		{text-align: center;}
.TextVCenter		{display: table-cell; vertical-align: middle;}
.TextVAlign			{vertical-align: baseline;}
.TextVTopAlign		{vertical-align: top;}
.TextNoWrap			{white-space: nowrap;}
.TextFullWidth		{width: 100%;}
.TextFullHeight		{height: 100%;}
.TextFullSize		{width: 100%; height: 100%;}
.FitHWidth			{left: 0px; right: 0px;}
.FullPageWidth		{clear: both; width: 100%; box-sizing: border-box;}
.FullPageHeight		{height: 100%; box-sizing: border-box;}
.FullPageSize		{clear: both; width: 100%; height: 100%; height: 100vh; box-sizing: border-box;}
.ViewportFit		{position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; box-sizing: border-box;}
.Clear				{clear: both;}
.FloatLeft			{float: left;}
.FloatRight			{float: right;}
.Absolute			{position: absolute;}
.Fixed				{position: fixed;}
.Relative			{position: relative;}
.NoDisplay			{display: none;}
.NoVisibility		{visibility: hidden;}
.HoverPointer		{cursor: pointer;}
.Z5					{z-index: 5;}		/* Body and content */
.Z10				{z-index: 10;}		/* Header and menus */
.Z15				{z-index: 15;}		/* Cookie warning */
.Z20				{z-index: 20;}		/* Dialog boxes */
.Z25				{z-index: 25;}		/* Error messages */
.Z30				{z-index: 30;}		/* Expiry */
.Z35				{z-index: 35;}		/* Debug buttons */
.Z40				{z-index: 40;}		/* Async postback wait overlay */
.RoundLeftBottom10	{border-radius: 0 0 0 0.625em;}
.RoundRightBottom10	{border-radius: 0 0 0.625em 0;}
.RoundBothBottom10	{border-radius: 0 0 0.625em 0.625em;}
.RoundLeftBottom20	{border-radius: 0 0 0 1.25em;}
.RoundRightBottom20	{border-radius: 0 0 1.25em 0;}
.RoundBothBottom20	{border-radius: 0 0 1.25em 1.25em;}

/****************************************************************************************/

.TestTableBorder	{border: 3px solid #00FFFF;}
.TestTableBorder th	{border: 3px solid #FF00FF;}
.TestTableBorder td	{border: 3px solid #FFFF00;}

/****************************************************************************************/

.NoTextSelection	{	/*	See also Slf.Js.EnableUserSelection() function in SlfContentPage.js
							CSS values:  none | text | toggle | element | elements | all | inherit
							Needed too: <element onselectstart="return false;" unselectable="on"></element>
						*/
						-webkit-user-select: none;	/* Chrome all & Safari all */
						-khtml-user-select: none;
						-moz-user-select: none;		/* Firefox all */
						-ms-user-select: none;		/* IE 10+ */
						-o-user-select: none;		/* Opera ... maybe */
						user-select: none;			/* see http://www.w3.org/TR/2000/WD-css3-userint-20000216 */
					}

/****************************************************************************************/

/*	Tweak scrollbars according to color selections, like this (presumably rgba() works too):
	scrollbar-base-color: #A40F0F;
	scrollbar-face-color: #A40F0F;
	scrollbar-shadow-color: #AA7777;
	scrollbar-highlight-color: #A44444;
	scrollbar-3dlight-color: #00FF00;
	scrollbar-darkshadow-color: #00FF00;
	scrollbar-track-color: #00FF00;
	scrollbar-arrow-color: #BBBB00;
*/
/*	See https://css-tricks.com/custom-scrollbars-in-webkit/
	::-webkit-scrollbar              {}
	::-webkit-scrollbar-button       {}
	::-webkit-scrollbar-track        {}
	::-webkit-scrollbar-track-piece  {}
	::-webkit-scrollbar-thumb        {}
	::-webkit-scrollbar-corner       {}
	::-webkit-resizer                {}
*/

/*****************************************************************************************
**                                                                                      **
** Hack to vertically center elements in a DIV also in IE. According to specs standards **
** a simple style="display: table-cell; vertical-align: middle;" should suffice, but    **
** alas, not with IE, the usual suspect :p                                              **
**                                                                                      **
** A lot of thanks for Bruno Fassino for this, saved me many hours :-)                  **
** See: http://www.brunildo.org/test/img_center.html                                    **
**                                                                                      **
** To use, insert an empty span as first child element of the "vertical-align: middle"  **
** DIV with the contents to be vertically centered. As in:                              **
**                                                                                      **
**   <div style="display: table-cell; vertical-align: middle;">                         **
**     <span class="IeVCenterLayoutHack"></span> Blablabla...                           **
**   </div>                                                                             **
**                                                                                      **
**   --- or ---                                                                         **
**                                                                                      **
**   <div class="TextVCenter">                                                          **
**     <span class="IeVCenterLayoutHack"></span> Blablabla...                           **
**   </div>                                                                             **
**                                                                                      **
** To center one DIV inside another DIV, use this constallation:                        **
**                                                                                      **
**   <table style="width: 100%; height: inherit;"><tr>                                  **
**     <td style="text-align: center; vertical-align: middle;">                         **
**       <div class="your_inner_DIV_class" style="display: inline-block;">              **
**         ... content here...                                                          **
**       </div>                                                                         **
**     </td>                                                                            **
**   </tr></table>                                                                      **
**                                                                                      **
*****************************************************************************************/

.IeVCenterLayoutHack
{
	width: 1px;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

/*****************************************************************************************
**                                                                                      **
** Hack to horizontally distribute elements. First, give the elements, for example      **
** DIVs, the styles: "display: inline-block; text-align: justify;". Then add a single   **
** span following the elements: "<span class="EvenSpaceHack"></span>". found here:      **
** http://stackoverflow.com/questions/6865194/fluid-width-with-equally-spaced-divs.     **
**                                                                                      **
*****************************************************************************************/

.EvenSpaceHack
{
	width: 100%;
	display: inline-block;
	font-size: 0;
	line-height: 0
}

/*****************************************************************************************
**                                                                                      **
** Brilliant little gem how to obfuscate an email address verbatim in the markup. From  **
** https://matt.berther.io/2009/01/15/hiding-an-email-address-from-spam-harvesters/.    **
**                                                                                      **
*****************************************************************************************/

.ReverseTextHack
{
  unicode-bidi: bidi-override;
  direction: rtl;
}

/*****************************************************************************************
**                                                                                      **
**                                 Rotating image                                       **
**                                                                                      **
*****************************************************************************************/

@-webkit-keyframes RotatingImageFrames360
{
	100% {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes RotatingImageFrames360
{
	100% {-moz-transform: rotate(360deg);}
}
@keyframes RotatingImageFrames360
{
	100%
	{
		-moz-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-webkit-keyframes RotatingImageFrames45
{
	100% {-webkit-transform: rotate(45deg);}
}
@-moz-keyframes RotatingImageFrames45
{
	100% {-moz-transform: rotate(45deg);}
}
@keyframes RotatingImageFrames45
{
	100%
	{
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}

/*****************************************************************************************
**                                                                                      **
**                                 Debug buttons                                        **
**                                                                                      **
*****************************************************************************************/

/*	Code-behind hide these if the user has no debug role or isn't logged in. */
.DebugButtons
{
	display: block;
	position: fixed;
	z-index: 35;
	height: 30px;
	top: 30%;
	left: 30%;
	border: 5px solid rgba(0, 0, 0, 0.0);
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 35;
	opacity: 0.1;
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;	/* Safari */
}
.DebugButtons:hover	{opacity: 1.0;}
.DebugButton
{
	display: inline-block;
	width: 20px;
	height: 19px;
	margin: 5px;
	padding-top: 1px;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	color: White;
	background-color: Red;
	float: left;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;	/* Safari */
}
.DebugButton:hover	{opacity: 1.0;}

/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                                                                                      **
**                               MasterPage related                                     **
**                                                                                      **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/

/* Some of the colors typically used on this website. */
.ColorRed			{color: rgb(128, 0, 0);}
.ColorRed2			{color: rgb(191, 33, 33);}
.ColorBlue			{color: rgb(92, 139, 191);}
.ColorBlue2			{color: rgb(68, 119, 174);}
.ColorGrey			{color: rgb(225, 225, 225);}
.BkColorRed			{background-color: rgb(128, 0, 0);}
.BkColorRed2		{background-color: rgb(191, 33, 33);}
.BkColorBlue		{background-color: rgb(92, 139, 191);}
.BkColorBlue2		{background-color: rgb(68, 119, 174);}
.BkColorGrey		{background-color: rgb(225, 225, 225);}

/****************************************************************************************/

.BlueGridBackground
{
	background-image: url(/Images/Backgrounds/BlueGrid_960x540.png);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: right bottom;
	background-size: cover;
}
.WhiteGridBackground
{
	/* Syncronize with MasterDialog and MasterDialogMaximized classes */
	background-image: url(/Images/Backgrounds/WhiteGrid_640x360.png);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: right bottom;
	background-size: cover;
}

/*****************************************************************************************
**                                                                                      **
**                                Header and Menus                                      **
**                                                                                      **
**  Triggers in PopupDivs are 46 pixels wide and 40 pixels high. The base font is 16px. **
**                                                                                      **
*****************************************************************************************/

.MasterHeader
{
	position: fixed;
	display: block;
	top: 0px;
	left: 0px;
	right: 0px;
	min-width: 300px;
	text-align: center;
	color: rgb(255, 255, 255);
	background-color: rgb(68, 119, 174);
	z-index: 10;
}

/*****************************************************************************************
**                                     Spacer                                           **
*****************************************************************************************/

.MasterHeaderSpacer
{
	display: inline-block;
	width: 2.875em;								/* 46px => 46px/16px => 2.875em */
	height: 2.5em;								/* 40px => 40px/16px => 2.5em */
}

/*****************************************************************************************
**                                      User                                            **
*****************************************************************************************/

.MasterHeaderProfile
{
	display: inline-block;
	height: 2.5em;								/* 40px => 40px/16px => 2.5em */
	padding: 0 1em;
	text-align: center;
	vertical-align: middle;
	color: rgba(255, 255, 255, 1.0);
}
.MasterHeaderProfileLink
{
	display: inline-block;
	padding: 0.1em 0.3em 0.2em 0.5em;
	color: rgb(255, 255, 128);
	font-size: 0.7em;
	cursor: pointer;
	border-radius: 0.4em;
	transition: background-color 0.3s, color 0.3s;
	-webkit-transition: background-color 0.3s, color 0.3s;	/* Safari */
}
.MasterHeaderProfileLink:hover
{
	color: rgb(255, 255, 255);
	background-color: rgb(128, 0, 0);
}

/*****************************************************************************************
**                                     Title                                            **
*****************************************************************************************/

.MasterHeaderTitle
{
	display: inline-block;
	height: 2.5em;								/* 40px => 40px/16px => 2.5em */
	padding: 0 1em 0 0;
	text-align: center;
	vertical-align: middle;
	color: rgba(255, 255, 255, 1.0);
}
.MasterHeaderTitle img
{
	width: 2em;									/* 32px => 32px/16px => 2em */
	height: 2em;								/* 32px => 32px/16px => 2em */
	padding: 0.25em 0.438em 0.25em 0.438em;		/* 4px => 4px/16px => 0.25em, 7px => 7px/16px => 0.438em */
}
.MasterHeaderTitleLink
{
	display: inline-block;
	padding: 0.1em 0.3em 0.2em 0.3em;
	color: rgb(255, 255, 128);
	cursor: pointer;
	border-radius: 0.4em;
	transition: background-color 0.3s, color 0.3s;
	-webkit-transition: background-color 0.3s, color 0.3s;	/* Safari */
}
.MasterHeaderTitleLink:hover
{
	color: rgb(255, 255, 255);
	background-color: rgb(128, 0, 0);
}

/*****************************************************************************************
**                                      Menu                                            **
*****************************************************************************************/

.MasterMenuTriggerHidden
{
	display: inline-block;
	width: 2.875em;								/* 46px => 46px/16px => 2.875em */
	height: 2.5em;								/* 40px => 40px/16px => 2.5em */
	color: rgb(255, 255, 255);
	background-color: rgb(68, 119, 174);
	cursor: pointer;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterMenuTriggerHidden:hover	{background-color: rgb(128, 0, 0);}
.MasterMenuTriggerHidden img
{
	width: 2em;									/* 32px => 32px/16px => 2em */
	height: 2em;								/* 32px => 32px/16px => 2em */
	padding: 0.25em 0.438em 0.25em 0.438em;		/* 4px => 4px/16px => 0.25em, 7px => 7px/16px => 0.438em */
}
.MasterMenuTriggerShown
{
	display: inline-block;
	width: 2.875em;								/* 46px => 46px/16px => 2.875em */
	height: 2.5em;								/* 40px => 40px/16px => 2.5em */
	color: rgb(255, 255, 255);
	background-color: rgb(128, 0, 0);
	cursor: pointer;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterMenuTriggerShown img
{
	width: 2em;									/* 32px => 32px/16px => 2em */
	height: 2em;								/* 32px => 32px/16px => 2em */
	padding: 0.25em 0.438em 0.25em 0.438em;		/* 4px => 4px/16px => 0.25em, 7px => 7px/16px => 0.438em */
}
.MasterMenuPopup
{
	border-width: 0.313em 0 0 0;				/* 5px => 5px/16px => 0.313em */
	border-style: solid;
	border-color: rgba(128, 0, 0, 1.0);
	padding: 0.625em;							/* 10px => 10px/16px => 0.625em */
	color: rgb(255, 255, 255);
	background-color: rgb(68, 119, 174);
}
.MasterMenuItem
{
	clear: both;
	padding: 0.313em;							/* 5px => 5px/16px => 0.313em */
	cursor: pointer;
	color: rgb(255, 255, 255);
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterMenuItem:hover			{background-color: rgb(128, 0, 0);}
.MasterMenuItemStuck
{
	clear: both;
	padding: 0.313em;							/* 5px => 5px/16px => 0.313em */
	color: rgb(255, 255, 255);
	background-color: rgb(92, 139, 191);
	cursor: pointer;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterMenuItemStuck:hover		{background-color: rgb(128, 0, 0);}
.MasterMenuItemDisabled
{
	clear: both;
	padding: 0.313em;							/* 5px => 5px/16px => 0.313em */
	opacity: 0.4;
}
.MasterMenuItemImage
{
	vertical-align: middle;
}
.MasterMenuItemImage img
{
	width: 2em;									/* 32px => 32px/16px => 2em */
	height: 2em;								/* 32px => 32px/16px => 2em */
	padding: 0.25em 0.438em 0.25em 0.438em;		/* 4px => 4px/16px => 0.25em, 7px => 7px/16px => 0.438em */
}
.MasterMenuItemText
{
	font-weight: bold;
	color: #FFFFFF;
	white-space: nowrap;
	vertical-align: middle;
	margin-bottom: 0.1em;
}
.MasterMenuItemText span
{
	display: block;
	clear: both;
	font-size: 0.7em;
	font-weight: normal;
	white-space: nowrap;
}
.MasterMenuItemSpacer
{
	clear: both;
	height: 2px;
	margin: 0.313em 0 0.313em 0;
	background-color: rgb(225, 225, 225);
}

/*****************************************************************************************
**                                    Language                                          **
*****************************************************************************************/

/* Images are 32x32 px but flags are 24x24 px, so add 8px total to sides */
.MasterLanguageTriggerFlag
{
	transform: scale(0.75);						/* 75% of 32px is 24px */
}
.MasterLanguageItem
{
	width: 12em;								/* Make sure no language string is longer, or a scrollbar appears on the bottom (looks ugly) */
	padding-right: 0.1em;
	max-height: 12em;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: auto;
}
.MasterLanguageItemNormal
{
	clear: both;
	white-space: nowrap;
	padding: 0.25em 0.5em;
	cursor: pointer;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterLanguageItemNormal:hover			{background-color: rgb(128, 0, 0);}
.MasterLanguageItemStuck
{
	clear: both;
	white-space: nowrap;
	padding: 0.25em 0.5em;
	background-color: rgb(92, 139, 191);
	cursor: pointer;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterLanguageItemStuck:hover			{background-color: rgb(128, 0, 0);}
.MasterLanguageItemDisabled
{
	clear: both;
	white-space: nowrap;
	padding: 0.25em 0.5em;
	opacity: 0.4;
}
.MasterLanguageItemFlag
{
	width: 1.5em;								/* 24px => 24px/16px => 1.5em */
	height: 1.5em;								/* 24px => 24px/16px => 1.5em */
	vertical-align: middle;
}
.MasterLanguageItemText
{
	margin-left: 0.5em;
	font-weight: bold;
	color: #FFFFFF;
	white-space: nowrap;
	vertical-align: middle;
}

/*****************************************************************************************
**                                 iprotus splash                                       **
*****************************************************************************************/

.MasterSplash			{margin: 5em 0 5em 0;		width: 200px; height:  67px; background: url(/Images/Splash/Splash_200x67.png)  no-repeat scroll center center;}
@media all and (min-width:  400px)	{.MasterSplash {width: 300px; height: 100px; background: url(/Images/Splash/Splash_300x100.png) no-repeat scroll center center;}}
@media all and (min-width:  600px)	{.MasterSplash {width: 400px; height: 133px; background: url(/Images/Splash/Splash_400x133.png) no-repeat scroll center center;}}
@media all and (min-width:  900px)	{.MasterSplash {width: 500px; height: 167px; background: url(/Images/Splash/Splash_500x167.png) no-repeat scroll center center;}}
@media all and (min-width: 1300px)	{.MasterSplash {width: 600px; height: 200px; background: url(/Images/Splash/Splash_600x200.png) no-repeat scroll center center;}}
@media all and (min-width: 1800px)	{.MasterSplash {width: 700px; height: 233px; background: url(/Images/Splash/Splash_700x233.png) no-repeat scroll center center;}}
@media all and (min-width: 2400px)	{.MasterSplash {width: 800px; height: 267px; background: url(/Images/Splash/Splash_800x267.png) no-repeat scroll center center;}}
@media all and (min-width: 3200px)	{.MasterSplash {width: 900px; height: 300px; background: url(/Images/Splash/Splash_900x300.png) no-repeat scroll center center;}}

/****************************************************************************************/

.MasterGnSplash			{margin: 5em 0 5em 0;		  width: 200px; height:  67px; background: url(/Images/Splash/GnSplash_200x67.png)  no-repeat scroll center center;}
@media all and (min-width:  400px)	{.MasterGnSplash {width: 300px; height: 100px; background: url(/Images/Splash/GnSplash_300x100.png) no-repeat scroll center center;}}
@media all and (min-width:  600px)	{.MasterGnSplash {width: 400px; height: 133px; background: url(/Images/Splash/GnSplash_400x133.png) no-repeat scroll center center;}}
@media all and (min-width:  900px)	{.MasterGnSplash {width: 500px; height: 167px; background: url(/Images/Splash/GnSplash_500x167.png) no-repeat scroll center center;}}
@media all and (min-width: 1300px)	{.MasterGnSplash {width: 600px; height: 200px; background: url(/Images/Splash/GnSplash_600x200.png) no-repeat scroll center center;}}
@media all and (min-width: 1800px)	{.MasterGnSplash {width: 700px; height: 233px; background: url(/Images/Splash/GnSplash_700x233.png) no-repeat scroll center center;}}
@media all and (min-width: 2400px)	{.MasterGnSplash {width: 800px; height: 267px; background: url(/Images/Splash/GnSplash_800x267.png) no-repeat scroll center center;}}
@media all and (min-width: 3200px)	{.MasterGnSplash {width: 900px; height: 300px; background: url(/Images/Splash/GnSplash_900x300.png) no-repeat scroll center center;}}

/*****************************************************************************************
**                                 Cookie warning                                       **
*****************************************************************************************/

.MasterCookieWarningBox
{
	position: fixed;
	left: 0px;
	right: 0px;
	bottom: 0px;
	border-top: 0.313em solid rgba(128, 0, 0, 0.9);				/* 5px => 5px/16px => 0.313em */
	padding: 2%;
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.9);
	font-size: 0.9em;
	z-index: 15;
	transition: border-top 0.3s, background-color 0.3s;
	-webkit-transition: border-top-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterCookieWarningBox:hover
{
	border-top-color: rgba(128, 0, 0, 1.0);
	background-color: rgba(0, 0, 0, 1.0);
}
.MasterCookieWarningWrapper
{
	display: table;
	width: 100%;
}
.MasterCookieWarningMessage
{
	display: table-cell;
	padding-right: 1em;
	vertical-align: middle;
}
.MasterCookieWarningButtons
{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
@media (max-width: 400px)
{
	.MasterCookieWarningWrapper
	{
		display: block;
		width: 100%;
	}
	.MasterCookieWarningMessage
	{
		display: block;
		padding-right: 0;
		padding-bottom: 1em;
		clear: both;
	}
	.MasterCookieWarningMessage h1
	{
		text-align: center;
	}
	.MasterCookieWarningButtons
	{
		display: block;
		clear: both;
	}
}

/****************************************************************************************/

.MasterCookieWarningMessage h1
{
	font-size: 1.4em;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.MasterCookieWarningMessage a
{
	color: rgb(225, 225, 0);
	text-decoration: none;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterCookieWarningMessage a:hover
{
	color: rgb(255, 255, 128);
}
.MasterCookieWarningLinkButton
{
	color: rgb(225, 225, 0);
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterCookieWarningLinkButton:hover
{
	color: rgb(255, 255, 128);
}

/****************************************************************************************/

.MasterCookieWarningButton
{
	display: inline-block;
	border: 0.188em solid rgb(128, 0, 0);		/* 3px => 3px/16px => 0.188em */
	border-radius: 1.25em;						/* 20px => 20px/16px => 1.25em */
	padding: 0.5em 2em 0.5em 2em;
	font-weight: bold;
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.1);
	text-align: center;
	clear: both;
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterCookieWarningButton:hover
{
	border-color: rgb(255, 0, 0);
	color: rgb(255, 255, 255);
	background-color: rgba(191, 33, 33, 0.5);
}

/****************************************************************************************/

.MasterCookieWarningCheckBox
{
	display: inline-block;
	margin-top: 1em;
	clear: both;
	cursor: pointer;
}
.MasterCookieWarningCheckBox td
{
	vertical-align: middle;
}
.MasterCookieWarningCheckBoxCheck
{
	margin-right: 0.5em;
	padding: 0.2em;
	background-color: rgb(128, 0, 0);
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterCookieWarningCheckBox:hover .MasterCookieWarningCheckBoxCheck
{
	background-color: rgb(255, 0, 0);
}
.MasterCookieWarningCheckBoxLabel
{
	color: rgb(225, 225, 225);
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterCookieWarningCheckBox:hover .MasterCookieWarningCheckBoxLabel
{
	color: rgb(255, 255, 255);
}

/*****************************************************************************************
**                                     Expiry                                           **
*****************************************************************************************/

.MasterExpiringBox
{
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background-color: rgba(0, 0, 0, 0.4);
}
.MasterExpiringButton
{
	display: inline-block;
	margin: 0 2em;
	border: 0.625em solid rgb(128, 0, 0);		/* 3px => 3px/16px => 0.188em */
	border-radius: 1.25em;						/* 20px => 20px/16px => 1.25em */
	padding: 1.25em;							/* 20px => 20px/16px => 1.25em */
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.9);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, background-color 0.3s;	/* Safari */
	animation: MasterExpiringButtonPulse 5s ease-in-out infinite;
}
.MasterExpiringButton:hover
{
	color: rgba(255, 255, 255, 1.0);
	background-color: rgba(0, 0, 0, 1.0);
}
.MasterExpiringDigits
{
	display: inline-block;
	padding: 0.625em 0 0.625em 0;
	font-size: 2.0em;
	letter-spacing: 0.25em;
}
/* Thanks to http://callmenick.com/post/simple-css3-transitions-transforms-animations-compilation */
@keyframes MasterExpiringButtonPulse
{
	0%		{border-color: rgba(128, 0, 0, 1.0);}
	50%		{border-color: rgba(255, 0, 0, 1.0);}
	100%	{border-color: rgba(128, 0, 0, 1.0);}
}

/****************************************************************************************/

.MasterExpiredPage
{
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background: url(/Images/Backgrounds/SunsetWalchwilHD.jpg) no-repeat 60% 40% scroll;
	background-size: cover;
	overflow: hidden;
	text-align: center;
	opacity: inherit;	/* Fixed positioned elements don't inherit opacity on all browsers (IE!), so explicitely set it */
}
.MasterExpiredPage div
{
	text-align: center;
}
.MasterExpiredButton
{
	display: inline-block;
	margin: 0 auto;
	border: 0.188em solid rgb(128, 0, 0);		/* 3px => 3px/16px => 0.188em */
	border-radius: 1.25em;						/* 20px => 20px/16px => 1.25em */
	padding: 0.5em 2em 0.5em 2em;
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.5);
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterExpiredButton:hover
{
	border-color: rgb(255, 0, 0);
	color: rgb(255, 255, 255);
	background-color: rgba(191, 33, 33, 0.5);
}

/****************************************************************************************/

.MasterAsyncPostbackWaitBox
{
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background-color: rgba(0, 0, 0, 0.1);
}
.MasterAsyncPostbackWaitFeedback
{
	display: inline-block;
	margin: 0 2em;
	border: 0.25em solid rgb(128, 0, 0);
	border-radius: 2.5em;
	padding: 0.5em 1em;
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.9);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterAsyncPostbackWaitFeedback:hover
{
	border-color: rgb(255, 0, 0);
	color: rgb(255, 255, 255);
	background-color: rgba(0, 0, 0, 1.0);
}
.MasterAsyncPostbackWaitFeedback img
{
	width: 2em;
	height: 2em;
	animation: RotatingImageFrames45 0.5s infinite linear;
	-webkit-animation: RotatingImageFrames45 0.5s infinite linear;
}
.MasterAsyncPostbackWaitFeedback td		{vertical-align: middle;}
.MasterAsyncPostbackWaitFeedback div	{margin: 0 1em;}
.MasterAsyncPostbackTimeoutFeedback
{
	display: inline-block;
	margin: 0 2em;
	border: 0.25em solid rgb(128, 0, 0);
	border-radius: 2.5em;
	padding: 0.5em 1em;
	color: rgb(225, 225, 225);
	background-color: rgba(0, 0, 0, 0.9);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterAsyncPostbackTimeoutFeedback:hover
{
	border-color: rgb(255, 0, 0);
	color: rgb(255, 255, 255);
	background-color: rgba(0, 0, 0, 1.0);
}
.MasterAsyncPostbackTimeoutFeedback img		{width: 2em; height: 2em;}
.MasterAsyncPostbackTimeoutFeedback td		{vertical-align: middle;}
.MasterAsyncPostbackTimeoutFeedback div		{margin: 0 1em;}

/*****************************************************************************************
**                                                                                      **
**                                     Footer                                           **
**                                                                                      **
*****************************************************************************************/

.MasterFooter
{
	clear: both;
	width: 100%;
	color: rgb(225, 225, 225);
	background-color: rgb(92, 139, 191);
	overflow: hidden;
	z-index: 5;
	box-sizing: border-box;
}

/****************************************************************************************/

.MasterFooterInfoBox
{
	display: table;
	width: 100%;
	padding: 1.5em 0.5em 1.5em 0.5em;
	box-sizing: border-box;
}
.MasterFooterPart
{
	width: 50%;
	display: table-cell;
	padding: 0.25em;
	text-align: center;
	vertical-align: middle;
	box-sizing: border-box;
}
.MasterFooterPart table
{
	display: inline-block;
}
.MasterFooterPart td
{
	padding: 0.1em 0.3em 0.2em 0.3em;
	vertical-align: top;
}
.MasterFooterPart span
{
	white-space: nowrap;
}
.MasterFooterLink
{
	color: rgb(255, 255, 128);
	cursor: pointer;
	border-radius: 0.4em;
	transition: background-color 0.3s, color 0.3s;
	-webkit-transition: background-color 0.3s, color 0.3s;	/* Safari */
}
.MasterFooterLink:hover
{
	color: rgb(255, 255, 255);
	background-color: rgb(128, 0, 0);
}
@media (max-width: 600px)
{
	.MasterFooterInfoBox
	{
		display: block;
		width: 100%;
		box-sizing: border-box;
	}
	.MasterFooterPart
	{
		display: inline-block;
		clear: both;
		width: 100%;
		padding: 1.25em;
		text-align: center;
		box-sizing: border-box;
	}
}

/****************************************************************************************/

.MasterFooterLogo
{
	text-align: center;
}
.MasterFooterLogo img
{
	width: 200px;
	Height: 67px;
	padding-bottom: 1.5em;
	text-align: center;
}
.MasterFooterButtons
{
	text-align: center;
}
.MasterFooterSocialLink
{
	padding: 0.5em;
	cursor: pointer;
}
.MasterFooterSocialLink img
{
	width: 48px;	/* Original size is 64x64, so scaled to 75% */
	height: 48px;
	opacity: 0.8;
	padding: 4px;
	border-radius: 15px;
	transition: background-color 0.3s, opacity 0.3s;
	-webkit-transition: background-color 0.3s, opacity 0.3s;	/* Safari */
}
.MasterFooterSocialLink img:hover
{
	opacity: 1.0;
	background-color: rgb(128, 0, 0);
}

/*****************************************************************************************
**                                                                                      **
**                                  Dialog template                                     **
**                                                                                      **
*****************************************************************************************/

.MasterDialog
{
	/* Syncronize with WhiteGridBackground class */
	color: rgb(68, 68, 68);
	background-color: rgb(255, 255, 255);
	background-image: url(/Images/Backgrounds/WhiteGrid_640x360.png);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: right bottom;
	background-size: cover;
	overflow: hidden;
	box-sizing: border-box;
	box-shadow: 0.5em 0.5em 0.5em rgba(0, 0, 0, 0.3);
}
.MasterDialogMaximized
{
	/* Syncronize with WhiteGridBackground class */
	color: rgb(68, 68, 68);
	background-color: rgb(255, 255, 255);
	background-image: url(/Images/Backgrounds/WhiteGrid_640x360.png);
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: right bottom;
	background-size: cover;
	overflow: hidden;
	box-sizing: border-box;
}

/****************************************************************************************/

.MasterDialogHeader
{
	height: 2.0em;
	padding: 0.25em 0.5em;
	background-color: rgb(92, 139, 191);
	text-align: right;
	vertical-align: middle;
	overflow: hidden;
}
.MasterDialogHeader > table {width: 100%;}
.MasterDialogHeaderTitle
{
	padding-right: 0.5em;
	font-size: 1.5em;
	font-weight: bold;
	color: rgb(210, 210, 210);
	background-color: rgb(92, 139, 191);
	text-align: right;
	vertical-align: middle;
}
.MasterDialogHeaderX
{
	width: 2.0em;
	height: 2.0em;
	background-color: rgb(92, 139, 191);
	text-align: center;
	vertical-align: middle;
}
.MasterDialogHeaderX img
{
	display: inline-block;
	width: 1.5em;
	height: 1.5em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
}
.MasterDialogHeaderX img:hover
{
	opacity: 1.0;
}
.MasterDialogHeaderXDisabled
{
	width: 2.0em;
	height: 2.0em;
	background-color: rgb(92, 139, 191);
	text-align: center;
	vertical-align: middle;
}
.MasterDialogHeaderXDisabled img
{
	display: inline-block;
	width: 1.5em;
	height: 1.5em;
	text-align: center;
	vertical-align: middle;
	opacity: 0.3;
}

/****************************************************************************************/

.MasterDialogContent					{overflow: auto;}
.MasterDialogContent a:link
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.MasterDialogContent a:active			{color: rgb(255, 13, 13);}
.MasterDialogContent a:visited			{color: rgb(128, 0, 0);}
.MasterDialogContent a:hover			{color: rgb(255, 13, 13);}

/* Keep both normal and maximized even if they are identical, due to CssClass ornamentation in the Slf.Cs framework */

.MasterDialogContentMaximized			{overflow: auto;}
.MasterDialogContentMaximized a:link
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.MasterDialogContentMaximized a:active	{color: rgb(255, 13, 13);}
.MasterDialogContentMaximized a:visited	{color: rgb(128, 0, 0);}
.MasterDialogContentMaximized a:hover	{color: rgb(255, 13, 13);}

/****************************************************************************************/

.MasterDialogFooter
{
	height: 4.0em;
	padding: 0 0.75em;
	overflow: hidden;
}
.MasterDialogFooter table			{width: 100%;}
.MasterDialogFooter td				{text-align: left; white-space: nowrap;}
.MasterDialogFooterMaximized
{
	height: 4.0em;
	padding: 0 0.75em;
	overflow: hidden;
}
.MasterDialogFooterMaximized table	{width: 100%;}
.MasterDialogFooterMaximized td		{text-align: center;}

/****************************************************************************************/

.MasterDialogHr
{
	height: 0.25em;
	width: 100%;
	margin: 1em 0 1em 0;
	clear: both;
	background-color: rgb(225, 225, 225);
	box-sizing: border-box;
}

/****************************************************************************************/

.MasterDialogButton
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(128, 0, 0);
	border-radius: 1.5em;
	padding: 0.5em 1.5em;
	color: rgb(128, 0, 0);
	background-color: rgb(255, 255, 255);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterDialogButton:hover
{
	border-color: rgb(255, 13, 13);
	color: rgb(255, 13, 13);
	background-color: rgb(242, 225, 225);
}
.MasterDialogButtonStuck
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(255, 13, 13);
	border-radius: 1.5em;
	padding: 0.5em 1.5em;
	color: rgb(128, 0, 0);
	background-color: rgb(255, 255, 255);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s; /* Safari */
}
.MasterDialogButtonStuck:hover
{
	border-color: rgb(255, 13, 13);
	color: rgb(255, 13, 13);
	background-color: rgb(242, 225, 225);
}
.MasterDialogButtonDisabled
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(177, 177, 177);
	border-radius: 1.5em;
	padding: 0.5em 1.5em;
	color: rgb(177, 177, 177);
	background-color: rgb(255, 255, 255);
	text-align: center;
}

/****************************************************************************************/

.MasterDialogMiniButton
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(128, 0, 0);
	border-radius: 1.5em;
	padding: 0.15em 0.35em;
	color: rgb(128, 0, 0);
	background-color: rgb(255, 255, 255);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterDialogMiniButton:hover
{
	border-color: rgb(255, 13, 13);
	color: rgb(255, 13, 13);
	background-color: rgb(242, 225, 225);
}
.MasterDialogMiniButtonStuck
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(255, 13, 13);
	border-radius: 1.5em;
	padding: 0.15em 0.35em;
	color: rgb(128, 0, 0);
	background-color: rgb(255, 255, 255);
	text-align: center;
	cursor: pointer;
	transition: color 0.3s, border-color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, border-color 0.3s, background-color 0.3s; /* Safari */
}
.MasterDialogMiniButtonStuck:hover
{
	border-color: rgb(255, 13, 13);
	color: rgb(255, 13, 13);
	background-color: rgb(242, 225, 225);
}
.MasterDialogMiniButtonDisabled
{
	display: inline-block;
	margin: 0.25em;
	border: 0.15em solid rgb(177, 177, 177);
	border-radius: 1.5em;
	padding: 0.15em 0.35em;
	color: rgb(177, 177, 177);
	background-color: rgb(255, 255, 255);
	text-align: center;
}

/****************************************************************************************/

.MasterDialogContent .MasterDialogLabel
{
	/* Width = [defined width] + 2*0.25 + 2*0.5 = [defined width] + 1.5em */
	/* Height = 2*0.25 + 2*0.5 + 1.0 = 2.5em */
	margin: 0.25em;
	display: inline-block;
	padding: 0.5em;
	float: left;
	text-align: right;
	vertical-align: middle;
	font-size: 1em;
}
.MasterDialogContentMaximized .MasterDialogLabel
{
	display: block;
	padding: 0.5em;
	clear: both;
	text-align: left;
	font-size: 1em;
}

/****************************************************************************************/

.MasterDialogTextBox
{
	/* Width = [defined width] + 2*0.25 + 2*0.5 = [defined width] + 1.5em */
	/* Height = 2*0.25 + 2*0.5 + 1.0 = 2.5em */
	margin: 0.25em;
	border: 0px solid rgb(255, 255, 255);	/* Needed in case the edit box decides for itself to use 3d borders */
	padding: 0.5em;
	background-color: rgb(225, 225, 225);
	vertical-align: middle;
	font-size: 1em;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterDialogTextBox:hover									{background-color: #EEEEEE;}
.MasterDialogContentMaximized .MasterDialogTextBox			{display: block; clear: both;}
.MasterDialogTextBoxLeadText
{
	/* Width = [defined width] + 2*0.25 + 2*0.5 = [defined width] + 1.5em */
	/* Height = 2*0.25 + 2*0.5 + 1.0 = 2.5em */
	margin: 0.25em;
	border: 0px solid rgb(255, 255, 255);	/* Needed in case the edit box decides for itself to use 3d borders */
	padding: 0.5em;
	color: rgb(177, 177, 177);
	background-color: rgb(225, 225, 225);
	vertical-align: middle;
	font-size: 1em;
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;	/* Safari */
}
.MasterDialogTextBoxLeadText:hover							{background-color: #EEEEEE;}
.MasterDialogContentMaximized .MasterDialogTextBoxLeadText	{display: block; clear: both;}
.MasterDialogTextBoxDisabled
{
	margin: 0.25em;
	border: 0px solid #FFFFFF;	/* Needed in case the edit box decides for itself to use 3d borders */
	padding: 0.5em;
	color: rgb(177, 177, 177);
	background-color: rgb(244, 244, 244);
	vertical-align: middle;
	font-size: 1em;
}
.MasterDialogContentMaximized .MasterDialogTextBoxDisabled	{display: block; clear: both;}

/****************************************************************************************/

.MasterDialogCheckBox				{margin: 0.5em; cursor: pointer;}
.MasterDialogCheckBox td			{vertical-align: middle;}
.MasterDialogCheckBoxDisabled		{opacity: 0.5;}
.MasterDialogCheckBoxDisabled td	{vertical-align: middle;}
.MasterDialogCheckBoxCheck
{
	margin: 0 0.5em;
	padding: 0.25em;
	cursor: pointer;
	background-color: rgb(225, 225, 225);
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;
}
.MasterDialogCheckBoxCheck:hover	{background-color: rgb(244, 244, 244);}
.MasterDialogCheckBoxCheckDisabled
{
	margin: 0 0.5em;
	padding: 0.25em;
	cursor: default;
	background-color: rgb(225, 225, 225);
}
.MasterDialogCheckBoxLabel
{
	color: rgb(128, 0, 0);
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.MasterDialogCheckBoxLabel:hover	{color: rgb(255, 13, 13);}
.MasterDialogCheckBoxLabelDisabled	{color: rgb(177, 177, 177); cursor: default;}
.MasterDialogCheckBox .MasterDialogCheckBoxCheck
{
	margin: 0 0.5em;
	padding: 0.25em;
	cursor: pointer;
	background-color: rgb(225, 225, 225);
	transition: background-color 0.3s;
	-webkit-transition: background-color 0.3s;
}
.MasterDialogCheckBox:hover .MasterDialogCheckBoxCheck		{background-color: rgb(244, 244, 244);}
.MasterDialogCheckBoxDisabled .MasterDialogCheckBoxCheck
{
	margin: 0 0.5em;
	padding: 0.25em;
	cursor: default;
	background-color: rgb(225, 225, 225);
}
.MasterDialogCheckBox .MasterDialogCheckBoxLabel
{
	color: rgb(128, 0, 0);
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.MasterDialogCheckBox:hover .MasterDialogCheckBoxLabel		{color: rgb(255, 13, 13);}
.MasterDialogCheckBoxDisabled .MasterDialogCheckBoxLabel	{color: rgb(177, 177, 177); cursor: default;}
.MasterDialogCheckBoxTextStyleSizer
{
	width: 0.75em;
	height: 0.75em;
	min-width: 0.75em;
	min-height: 0.75em;
	max-width: 0.75em;
	max-height: 0.75em;
	overflow: hidden;
	display: inline-block;
}
.MasterDialogCheckBox label
{
	color: rgb(128, 0, 0);
	vertical-align: middle;
	padding-left: 0.5em;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;
}
.MasterDialogCheckBox label:hover					{color: rgb(255, 13, 13); cursor: pointer;}
.MasterDialogCheckBox input[type="checkbox"]		{vertical-align: middle;}
.MasterDialogCheckBox input[type="checkbox"]:hover	{cursor: pointer;}

/****************************************************************************************/

.MasterDialogText					{padding: 0.5em;}
.MasterDialogText h1				{font-size: 1.5em;}
.MasterDialogText p					{margin: 0.5em 0;}
.MasterDialogTextLink
{
	color: rgb(128, 0, 0);
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterDialogTextLink:hover			{color: rgb(255, 13, 13);}
.MasterDialogTextLink h1			{font-size: 1.5em;}
.MasterDialogTextLink p				{margin: 0.5em 0;}
.MasterDialogTextLinkDisabled		{color: rgb(177, 177, 177); cursor: default;}
.MasterDialogTextLinkDisabled h1	{font-size: 1.5em;}
.MasterDialogTextLinkDisabled p		{margin: 0.5em 0;}

/****************************************************************************************/

.MasterDialogCaptcha
{
	margin: 0.25em;
	border: 0.5em solid rgba(225, 225, 225, 1.0);
}

/****************************************************************************************/

.MasterDialogTabControl			{}
.MasterDialogTabControlTabRow
{
	clear: both;
	display: block;
	position: relative;
	margin-left: 1em;
	margin-right: 1em;
}
.MasterDialogTabControlTabPanes
{
	clear: both;
	display: block;
	background-color: rgba(244, 244, 244, 0.7);
/*	background-color: rgba(199, 199, 244, 0.3);*/
}
.MasterDialogTabControlTab
{
	float: left;
	display: inline-block;
	margin-top: 0.5em;
	border-radius: 0.5em 0.5em 0 0;
	padding: 0.5em 1.0em;
	color: rgb(128, 0, 0);
	background-color: rgba(225, 225, 225, 0.7);
	font-size: 1em;
	white-space: nowrap;
	transition: color 0.3s, background-color 0.3s;
	-webkit-transition: color 0.3s, background-color 0.3s;	/* Safari */
}
.MasterDialogTabControlTab:hover
{
	color: rgb(255, 13, 13);
	background-color: rgba(242, 225, 225, 0.7);
	cursor: pointer;
}
.MasterDialogTabControlTabSelected
{
	float: left;
	display: inline-block;
	border-radius: 0.5em 0.5em 0 0;
	padding: 0.8em 1.0em 0.7em 1.0em;
	background-color: rgba(244, 244, 244, 0.7);
	font-size: 1em;
	font-weight: bold;
	white-space: nowrap;
}
.MasterDialogTabControlTabDisabled
{
	float: left;
	display: inline-block;
	margin-top: 0.4em;
	border-radius: 0.5em 0.5em 0 0;
	padding: 0.5em 1.0em;
	color: rgb(177, 177, 177);
	background-color: rgba(225, 225, 225, 0.7);
	white-space: nowrap;
}
.MasterDialogTabControlPane			{overflow: auto; padding: 1em;}
.MasterDialogTabControlPaneHidden	{overflow: auto; display: none;}

/****************************************************************************************/

.MasterDialogOnlineMap
{
	position: relative;
	border: 0.1em solid rgb(225, 225, 225);
}
.MasterDialogOnlineMapPosition
{
	/* Values match the generated "(c) OpenStreetMaps contributors" element. */
	position: absolute;
	border: 1px solid #999999;
	color: #333333;
	background-color: #EEEEEE;
	padding: 2px;
	top: 3px;
	right: 3px;
	font-size: 10px;
	font-weight: normal;
	filter: alpha(opacity = 60);
	opacity: 0.6;
}

/*****************************************************************************************
**                                                                                      **
**                                  Message Boxes                                       **
**                                                                                      **
*****************************************************************************************/

.MasterMessage									{width: 25em;}
.MasterMessage > div							{display: table;}
.MasterMessageMaximized							{}
.MasterMessage .MasterMessageIcon
{
	display: table-cell;
	width: 4em;
	padding: 1em;
	text-align: center;
	vertical-align: bottom;
}
.MasterMessageMaximized .MasterMessageIcon
{
	padding: 1em;
	text-align: right;
}
.MasterMessage .MasterMessageText
{
	display: table-cell;
	width: 17em;
	padding: 1em;
	vertical-align: top;
	overflow: auto;
}
.MasterMessageMaximized .MasterMessageText		{padding: 1em;}
.MasterMessageIcon img							{width: 4em; height: 4em;}
.MasterMessageText h1							{font-size: 1.3em; margin: 0 0 0.5em 0;}
.MasterMessageText p							{font-size: 1.0em; margin: 0.5em 0 0 0;}

/****************************************************************************************/

.MasterMiniMessage					{}
.MasterMiniMessageContent
{
	position: fixed;
	padding: 1em;
	color: rgb(66, 66, 66);
	background-color: rgb(255, 255, 255);
	z-index: 25;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
}
.MasterMiniMessageContent a:link
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterMiniMessageContent a:active	{color: rgb(255, 13, 13);}
.MasterMiniMessageContent a:visited	{color: rgb(128, 0, 0);}
.MasterMiniMessageContent a:hover	{color: rgb(255, 13, 13);}
.MasterMiniMessageContent h1		{font-weight: bold;}
.MasterMiniMessageContent p			{}
.MasterMiniMessageContent ul		{margin-top: 0.25em; padding-left: 1.5em; list-style-type: disc; list-style-position: outside;}
.MasterMiniMessageContent li		{font-size: 0.8em;}

.MasterMiniMessageModalPane			{z-index: 25; opacity: 0.01;}	/* Certain browsers does not render fully transparent elements */
.MasterMiniInfoMessage				{border: 0.5em solid rgb(92, 139, 191);}
.MasterMiniErrorMessage				{border: 0.5em solid rgb(128, 0, 0);}
.MasterBubbleNoCallout				{border-radius: 1.5em;}
.MasterBubbleTopLeftCallout			{border-radius: 0 1.5em 1.5em 1.5em;}
.MasterBubbleTopRightCallout		{border-radius: 1.5em 0 1.5em 1.5em;}
.MasterBubbleBottomLeftCallout		{border-radius: 1.5em 1.5em 1.5em 0;}
.MasterBubbleBottomRightCallout		{border-radius: 1.5em 1.5em 0 1.5em;}

/*****************************************************************************************
**                                                                                      **
**                                 Specific dialogs                                     **
**                                                                                      **
**    Width of Label + Textbox = [defined widths] + 1.5em (label) + 1.5em (textbox)     **
**        Total width (label/text) = width label + width text + 5em (paddings)          **
**    Add 0.1-0.2 to total width to allow browsers slack on accuracy (Chrome fails)     **
**                                                                                      **
**           Content height = total height - 2.5em (header) - 4.5em (footer)            **
**              Total height = content height + 7.0em (header + footer)                 **
**                                                                                      **
*****************************************************************************************/

.MasterLogonForm																		{width: 35.1em;}	/* Label + TextBox + 5 + slack */
.MasterLogonFormMaximized																{}
.MasterLogonFormContent																	{padding: 1.0em;}
.MasterLogonFormContentMaximized														{padding: 1.0em;}
.MasterLogonFormContent .MasterLogonFormLabel											{width: 10em;}
.MasterLogonFormContentMaximized .MasterLogonFormLabel									{}
.MasterLogonFormContent .MasterLogonFormTextBox											{width: 20em;}
.MasterLogonFormContentMaximized .MasterLogonFormTextBox								{width: 94%;}

/****************************************************************************************/

.MasterRememberMeWarning																{width: 27em;}
.MasterRememberMeWarningMaximized														{}
.MasterRememberMeWarningContent															{padding: 1.0em;}
.MasterRememberMeWarningContentMaximized												{padding: 1.0em;}

/****************************************************************************************/

.MasterSignUpForm																		{width: 40.1em;}	/* Label + TextBox + 5 + slack */
.MasterSignUpFormMaximized																{}
.MasterSignUpFormContent																{padding: 1.0em;}
.MasterSignUpFormContentMaximized														{padding: 1.0em;}
.MasterSignUpFormContent .MasterSignUpFormLabel											{width: 10em;}
.MasterSignUpFormContentMaximized .MasterSignUpFormLabel								{}
.MasterSignUpFormContent .MasterSignUpFormTextBox										{width: 25em;}
.MasterSignUpFormContentMaximized .MasterSignUpFormTextBox								{width: 94%;}

/****************************************************************************************/

.MasterSignUpApproval																	{width: 25em;}
.MasterSignUpApprovalMaximized															{}
.MasterSignUpApprovalContent															{padding: 1.0em;}
.MasterSignUpApprovalContentMaximized													{padding: 1.0em;}

/****************************************************************************************/

.MasterRecoverPasswordForm																{width: 40.1em;}	/* Label + TextBox + 5 + slack */
.MasterRecoverPasswordFormMaximized														{}
.MasterRecoverPasswordFormContent														{padding: 1.0em;}
.MasterRecoverPasswordFormContentMaximized												{padding: 1.0em;}
.MasterRecoverPasswordFormContent .MasterRecoverPasswordFormLabel						{width: 10em;}
.MasterRecoverPasswordFormContentMaximized .MasterRecoverPasswordFormLabel				{}
.MasterRecoverPasswordFormContent .MasterRecoverPasswordFormTextBox						{width: 25em;}
.MasterRecoverPasswordFormContentMaximized .MasterRecoverPasswordFormTextBox			{width: 94%;}

/****************************************************************************************/

.MasterRecoverPasswordApproval															{width: 45.1em;}	/* Label + TextBox + 5 + slack */
.MasterRecoverPasswordApprovalMaximized													{}
.MasterRecoverPasswordApprovalContent													{padding: 1.0em;}
.MasterRecoverPasswordApprovalContentMaximized											{padding: 1.0em;}
.MasterRecoverPasswordApprovalContent .MasterRecoverPasswordApprovalLabel				{width: 15em;}
.MasterRecoverPasswordApprovalContentMaximized .MasterRecoverPasswordApprovalLabel		{}
.MasterRecoverPasswordApprovalContent .MasterRecoverPasswordApprovalTextBox				{width: 25em;}
.MasterRecoverPasswordApprovalContentMaximized .MasterRecoverPasswordApprovalTextBox	{width: 94%;}

/****************************************************************************************/

.MasterContactForm																		{width: 42.1em;}	/* Label + TextBox + 5 + slack */
.MasterContactFormMaximized																{}
.MasterContactFormContent																{padding: 1.0em;}
.MasterContactFormContentMaximized														{padding: 1.0em;}
.MasterContactFormContent .MasterContactFormLabel										{width: 10em;}
.MasterContactFormContentMaximized .MasterContactFormLabel								{}
.MasterContactFormContent .MasterContactFormTextBox										{width: 25em;}
.MasterContactFormContentMaximized .MasterContactFormTextBox							{width: 94%;}
.MasterContactFormContent .MasterContactFormAddress										{width: 10em; height: 25em; white-space: nowrap;}
.MasterContactFormContentMaximized .MasterContactFormAddress							{}

/****************************************************************************************/

.MasterLegalForm																		{width: 53em;}
.MasterLegalFormMaximized																{}
.MasterLegalFormContent																	{padding: 1.0em;}
.MasterLegalFormContentMaximized														{padding: 1.0em;}
.MasterLegalFormContent .MasterLegalTextBox												{height: 28em;}
.MasterLegalFormContentMaximized .MasterLegalTextBox									{}

/****************************************************************************************/

.MasterSendMailError																	{width: 35em;}
.MasterSendMailErrorMaximized															{}
.MasterSendMailError .MasterErrorMessageTextbox											{width: 25em; max-height: 15em;}
.MasterSendMailError .MasterErrorMessageButton											{position: relative; text-align: center;}
.MasterSendMailErrorMaximized .MasterErrorMessageTextbox								{}
.MasterSendMailErrorMaximized .MasterErrorMessageButton									{}
.MasterErrorMessageTextbox
{
	margin: 1em 0;
	border: 0.5em solid rgba(244, 244, 244, 0.0);	/* Fake padding so that the scrollbar is "padded" inside the box */
	background-color: rgba(244, 244, 244, 0.7);
/*	background-color: rgba(199, 199, 244, 0.3);*/
	font-family: Monospace;
	white-space: nowrap;
	overflow: auto;
}

/****************************************************************************************/

.MasterViewStateForm																		{width: 53em; opacity: 1.0;}
.MasterViewStateFormMaximized																{}
.MasterViewStateFormContent																	{padding: 1.0em;}
.MasterViewStateFormContentMaximized														{padding: 1.0em;}
.MasterViewStateFormContent .MasterViewStateFormCheckBox									{width: 33%; float: left;}
.MasterViewStateFormContentMaximized .MasterViewStateFormCheckBox							{}
.MasterViewStateFormContent .MasterViewStateTextBox											{width: 50em; height: 25em;}
.MasterViewStateFormContentMaximized .MasterViewStateTextBox								{}
.MasterViewStateTextBox
{
	margin: 1em 0;
	border: 0.5em solid rgba(244, 244, 244, 0.0);	/* Fake padding so that the scrollbar is "padded" inside the box */
	background-color: rgba(244, 244, 244, 0.7);
/*	background-color: rgba(199, 199, 244, 0.3);*/
	font-family: Monospace;
	white-space: nowrap;
	overflow: auto;
}

/*****************************************************************************************
**                                                                                      **
**                               Master Legal Texts                                     **
**                                                                                      **
*****************************************************************************************/

.MasterLegalTextBox
{
	padding-right: 0.5em;
	font-size: 1em;
	overflow: auto;
}
.MasterLegalTextBox h1
{
	margin-top: 1em;
	margin-bottom: 1em;
	font-size: 1em;
	font-weight: bold;
}
.MasterLegalTextBox h2
{
	display: block;
	margin-bottom: 1em;
	border: 0.25em solid rgb(128, 0, 0);
	border-radius: 0.5em;
	padding: 1em;
	color: rgb(244, 44, 44);
	font-size: 0.8em;
	font-weight: bold;
}
.MasterLegalTextBox p
{
	margin-bottom: 0.5em;
	font-size: 0.8em;
}
.MasterLegalTextBox ul
{
	padding-left: 2em;
	list-style-type: disc;
	list-style-position: outside;
}
.MasterLegalTextBox li
{
	margin-bottom: 0.5em;
	font-size: 0.8em;
}

/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                                                                                      **
**                               ContentPage related                                    **
**                                                                                      **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/

.MasterContent
{
	color: rgb(66, 66, 66);
	background-color: rgb(255, 255, 255);
	min-height: 100vh;
	z-index: 5;
}
.MasterContent a:link
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.MasterContent a:active		{color: rgb(255, 13, 13);}
.MasterContent a:visited	{color: rgb(128, 0, 0);}
.MasterContent a:hover		{color: rgb(255, 13, 13);}

/*****************************************************************************************
**                                  Header Section                                      **
*****************************************************************************************/

.ContentHeader
{
	height: 100vh;
	overflow: hidden;
	box-sizing: border-box;
}
.ContentDelimiter
{
	width: 100%;
	height: 1px;
	background-color: rgb(128, 0, 0);
}

/*****************************************************************************************
**                                   Page Content                                       **
*****************************************************************************************/

.ContentInfoBox			{padding: 2em;}
.ContentInfoHeader		{margin-bottom: 1em; clear: both;}
.ContentInfoContent		{display: block;}
.ContentInfoImage		{display: block; width: 14em; height: 14em; margin: 0 auto;}
.ContentInfoText		{margin-top: 1em; display: block;}
.ContentInfoFooter		{margin-top: 1em; clear: both;}

@media all and (min-width: 400px)
{
	.ContentInfoHeader		{margin-bottom: 1em; clear: both;}
	.ContentInfoContent		{display: table; width: 100%;}
	.ContentInfoImage		{display: table-cell; padding-right: 1em; width: 9em; height: 9em; vertical-align: top;}
	.ContentInfoText		{margin-top: 0; display: table-cell; vertical-align: middle;}
	.ContentInfoFooter		{margin-top: 1em; clear: both;}
}
@media all and (min-width: 600px)
{
	.ContentInfoImage		{display: table-cell; padding-right: 1em; width: 12em; height: 12em; vertical-align: top;}
}
@media all and (min-width: 900px)
{
	.ContentInfoImage		{display: table-cell; padding-right: 1em; width: 15em; height: 15em; vertical-align: top;}
}

/*****************************************************************************************
**                                                                                      **
**                                   Default page                                       **
**                                                                                      **
*****************************************************************************************/

.DefaultPageHeaderPane
{
	border: 0.5em solid rgb(92, 139, 191);
	color: rgb(255, 255, 255);
	background-color: rgb(92, 139, 191);
	text-align: right;
	text-transform: uppercase;
	font-size: 1.3em;
	font-weight: bold;
	letter-spacing: 0.2em;
}
.DefaultPageTextPane			{}
.DefaultPageFooterPane
{
	padding: 0.5em;
	color: rgb(68, 119, 174);
	background-color: rgb(225, 225, 225);
	font-size: 0.8em;
	font-variant: small-caps;
	font-weight: bold;
	letter-spacing: 0.1em;
}

/****************************************************************************************/

.DefaultPageTextPane h1			{margin-bottom: 1em; font-size: 1em; font-weight: bold;}
.DefaultPageTextPane h2
{
	display: block;
	margin-top: 1em;
	border: 0.25em solid rgb(225, 225, 225);
	border-radius: 0.5em;
	padding: 1em;
	color: rgb(68, 119, 174);
	font-size: 0.8em;
	font-weight: bold;
}
.DefaultPageTextPane p			{margin: 0.5em 0; font-size: 0.8em;}
.DefaultPageTextPane ul			{margin-left: 1em; list-style-type: disc; list-style-position: outside;}
.DefaultPageTextPane li			{margin: 0.5em 0; font-size: 0.8em;}

/****************************************************************************************/

.DefaultPageFooterLink
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.DefaultPageFooterLink:hover	{color: rgb(255, 13, 13);}
.DefaultPageFooterLinkDisabled	{color: rgb(177, 177, 177);}

/*****************************************************************************************
**                                                                                      **
**                                    Blogs page                                        **
**                                                                                      **
*****************************************************************************************/

.BlogPageHeaderPane
{
	border: 0.5em solid rgb(92, 139, 191);
	color: rgb(255, 255, 255);
	background-color: rgb(92, 139, 191);
	text-align: right;
	text-transform: uppercase;
	font-size: 1.3em;
	font-weight: bold;
	letter-spacing: 0.2em;
}
.BlogPageTextPane				{}
.BlogPageFooterPane
{
	padding: 0.5em;
	color: rgb(68, 119, 174);
	background-color: rgb(225, 225, 225);
	font-size: 0.8em;
	font-variant: small-caps;
	font-weight: bold;
	letter-spacing: 0.1em;
}

/****************************************************************************************/

.BlogPageTextPane a
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.BlogPageTextPane a:hover		{color: rgb(255, 13, 13);}
.BlogPageTextPane h1			{margin-bottom: 1em; font-size: 1em; font-weight: bold;}
.BlogPageTextPane h2			{margin-bottom: 1em; font-size: 0.9em; font-weight: bold;}
.BlogPageTextPane p				{margin: 0.5em 0; font-size: 0.8em;}
.BlogPageTextPane ul			{margin-left: 1em; list-style-type: disc; list-style-position: outside;}
.BlogPageTextPane li			{margin: 0.5em 0; font-size: 0.8em;}
.BlogPageTextPaneOnlyEnglish p
{
	margin-bottom: 1em;
	font-size: 1em;
	font-weight: bold;
	color: rgb(211, 0, 0);
	padding: 0.5em;
	border: 2px solid rgb(211, 0, 0);
}

/****************************************************************************************/

.BlogPageFooterLink
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.BlogPageFooterLink:hover		{color: rgb(255, 13, 13);}
.BlogPageFooterLinkDisabled		{color: rgb(177, 177, 177);}

/*****************************************************************************************
**                                                                                      **
**                                     News page                                        **
**                                                                                      **
*****************************************************************************************/

.NewsPageHeaderPane
{
	border: 0.5em solid rgb(92, 139, 191);
	color: rgb(255, 255, 255);
	background-color: rgb(92, 139, 191);
	text-align: right;
	text-transform: uppercase;
	font-size: 1.3em;
	font-weight: bold;
	letter-spacing: 0.2em;
}
.NewsPageTextPane
{
}
.NewsPageFooterPane
{
	padding: 0.5em;
	color: rgb(68, 119, 174);
	background-color: rgb(225, 225, 225);
	font-size: 0.8em;
	font-variant: small-caps;
	font-weight: bold;
	letter-spacing: 0.1em;
}

/****************************************************************************************/

.NewsPageTextPane a
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.NewsPageTextPane a:hover		{color: rgb(255, 13, 13);}
.NewsPageTextPane h1			{margin-bottom: 1em; font-size: 1em; font-weight: bold;}
.NewsPageTextPane h2			{margin-bottom: 1em; font-size: 0.9em; font-weight: bold;}
.NewsPageTextPane p				{margin: 0.5em 0; font-size: 0.8em;}
.NewsPageTextPane ul			{margin-left: 1em; list-style-type: disc; list-style-position: outside;}
.NewsPageTextPane li			{margin: 0.5em 0; font-size: 0.8em;}
.NewsPageTextPane table			{margin: 2em 0; font-size: 0.8em; max-width: 50em;}
.NewsPageTextPane td			{padding: 0.5em; white-space: nowrap; font-weight: bold; vertical-align: top;}
.NewsPageTextPane td > p		{font-size: 0.9em; font-weight: normal; white-space: normal; color: rgb(44, 44, 44);}
.NewsPageTextPane td > img		{width: 7em; height: 7em; border: 5px solid rgb(225, 225, 225); border-radius: 7em;}
.NewsPageTextPane hr			{height: 1px; background-color: rgb(225, 225, 225);}
.NewsPageAdNovumInsureTech													{display: block;		margin: 0 auto;		width: 14em; height: 10.06em;}
@media all and (min-width: 400px)	{.NewsPageAdNovumInsureTech				{display: table-cell;	padding-right: 1em;	width: 10em; height:  7.19em; vertical-align: top;}}
@media all and (min-width: 600px)	{.NewsPageAdNovumInsureTech				{display: table-cell;	padding-right: 1em;	width: 16em; height: 11.50em; vertical-align: top;}}
@media all and (min-width: 900px)	{.NewsPageAdNovumInsureTech				{display: table-cell;	padding-right: 1em;	width: 22em; height: 15.81em; vertical-align: top;}}
.NewsPageDutchFinancialNewsOct1st2016										{display: block;		margin: 0 auto;		width: 14em; height: 10.98em;}
@media all and (min-width: 400px)	{.NewsPageDutchFinancialNewsOct1st2016	{display: table-cell;	padding-right: 1em;	width: 10em; height:  7.84em; vertical-align: top;}}
@media all and (min-width: 600px)	{.NewsPageDutchFinancialNewsOct1st2016	{display: table-cell;	padding-right: 1em;	width: 16em; height: 12.55em; vertical-align: top;}}
@media all and (min-width: 900px)	{.NewsPageDutchFinancialNewsOct1st2016	{display: table-cell;	padding-right: 1em;	width: 22em; height: 17.25em; vertical-align: top;}}
.NewsPageAdNovumElectricityGrid												{display: block;		margin: 0 auto;		width: 14em; height: 9.55em;}
@media all and (min-width: 400px)	{.NewsPageAdNovumElectricityGrid		{display: table-cell;	padding-right: 1em;	width: 10em; height:  6.82em; vertical-align: top;}}
@media all and (min-width: 600px)	{.NewsPageAdNovumElectricityGrid		{display: table-cell;	padding-right: 1em;	width: 16em; height: 10.91em; vertical-align: top;}}
@media all and (min-width: 900px)	{.NewsPageAdNovumElectricityGrid		{display: table-cell;	padding-right: 1em;	width: 22em; height: 15.00em; vertical-align: top;}}
.NewsPageTextPaneOnlyEnglish p
{
	margin-bottom: 1em;
	font-size: 1em;
	font-weight: bold;
	color: rgb(211, 0, 0);
	padding: 0.5em;
	border: 2px solid rgb(211, 0, 0);
}

/****************************************************************************************/

.NewsPageFooterLink
{
	color: rgb(128, 0, 0);
	text-decoration: none;
	cursor: pointer;
	transition: color 0.3s;
	-webkit-transition: color 0.3s;	/* Safari */
}
.NewsPageFooterLink:hover		{color: rgb(255, 13, 13);}
.NewsPageFooterLinkDisabled		{color: rgb(177, 177, 177);}

/*****************************************************************************************
**                                                                                      **
**                                   QR code page                                       **
**                                                                                      **
*****************************************************************************************/

.QrCodePageSplash				/* Table */
{
	display: table;
	width: 100%;
	height: 100%;
	border: 2em solid rgba(0, 0, 0, 0);
	min-height: 25em;
	box-sizing: border-box;
}
.QrCodePageSplashSpacer			/* Row */
{
	display: table-row;
}
.QrCodePageSplashSpacer div		/* Cell */
{
	display: table-cell;
	height: 2.5em;				/* Sync with MasterHeaderSpacer height. */
}
.QrCodePageSplashForm			/* Row */
{
	display: table-row;
	text-align: center;
	vertical-align: middle;
}
.QrCodePageSplashFormInner		/* Cell */
{
	display: table-cell;
	height: 5em;
	padding: 0 0 1em 0;
	text-align: center;
}
.QrCodePageSplashFormText
{
	display: inline;
}
.QrCodePageSplashFormTextCount
{
	text-align: center;
	font-size: 0.8em;
	white-space: nowrap;
}
.QrCodePageSplashFormTextBox
{
	clear: both;
	width: 100%;
	max-width: 43.6em;
	box-sizing: border-box;
}
.QrCodePageSplashImage			/* Row */
{
	display: table-row;
}
.QrCodePageSplashQrCode			/* Cell with SlfQrCode control that generates the background QR code image */
{
	display: table-cell;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
}

/****************************************************************************************/

.QrCodePageApiForm
{
	clear: both;
	margin-top: 1em;
	border: 0.25em solid rgb(225, 225, 225);
	border-radius: 0.5em;
	padding: 1em;
	font-size: 0.8em;
}
.QrCodePageApiFormTextBoxHeader
{
	clear: both;
	padding-left: 0.5em;
	font-size: 0.9em;
	font-weight: bold;
	text-align: left;
}
.QrCodePageApiFormTextBox
{
	clear: both;
	width: 99%;
	box-sizing: border-box;
}
.QrCodesApiFormCounter
{
	clear: both;
	padding-bottom: 0.5em;
	font-size: 0.8em;
	text-align: right;
	white-space: nowrap;
}

/*****************************************************************************************
**                                                                                      **
**                                   SIIA2017 page                                      **
**                                                                                      **
*****************************************************************************************/

.SIIA2017ContentBox			{padding: 3em; box-sizing: border-box;}
.SIIA2017Mission			{padding: 3em; text-align: center; font-size: 1.2em; font-weight: bold;}
.SIIA2017Image				{padding: 3em;}
.SIIA2017TextPane			{padding: 3em;}
.SIIA2017TextPane h1		{font-size: 1.1em; font-weight: bold; padding: 0.5em 0;}
.SIIA2017TextPane p			{padding: 0.5em 0;}

/****************************************************************************************/

