/* ---- Styled elements ---- */

/* ---- Standard white content box ---- */

.box {
	background-color: white;
	padding: 10px;
}
.box:after {
	content: "";
	border-top: 1px solid #CCC;
	left: 0; top: 0; right: 0; bottom: 0;
	position: absolute;
	pointer-events: none;
}
.stack>.box { border-top: 1px solid #CCC; }

.box h3 {
	font-weight: normal;
	line-height: 1.2em;
	padding-bottom: 0.6em;
}
.box h3 a:hover { text-decoration: underline; color: #FBAD39; }
.box a { position: relative; z-index: 1; } /* Opera(/IE?) */

.box .date {
	margin-top: -0.5em;
	color: #CCC;
	font-family: PT Sans;
	text-transform: uppercase;
	font-size: 0.7em;
	padding-bottom: 0.6em;
}
.box .date a { color: #CCC; }
.box .date .new { background-color: #DD5A31; color: white; padding: 2px 4px; }
.box .date .new:before { font-family: Verdana; content: "\25CB \25CB"; letter-spacing: 0.2em; }

.box .section { color: #AAA; text-transform: uppercase; font-family: Nevis; letter-spacing: 3px; font-size: 0.7em; }
.box p img { max-width: 100%; }

/* ---- Unboxed body content ---- */

.unboxed { padding-top: 0.5em; padding-bottom: 1em; }
.unboxed h3 { font-weight: normal; }

/* ---- Green-topped content box ---- */

.greenbox {
	background-color: #DEE6D4;
	padding: 0.5em;
	font-family: PT Sans;
}
.greenbox h3 {
	font-weight: normal;
	font-size: 0.9em;
	background-color: #D1DBC3;
	padding: 0.5em ;
	margin: -0.5em -0.5em 0.5em -0.5em;	/* reverse padding */
}
.greenbox:not(.buzz) h3 {
	color: #231F20 !important;
	font-family: Nevis;
	text-transform: uppercase;
	letter-spacing: 3px;
}

.greenbox.borderless { padding: 0; }
.greenbox.borderless h3 { margin: 0; }
.greenbox.borderless .inner { padding: 0.5em; }

/* ---- Buzz ---- */

.greenbox.buzz h3 {
	background-color: #51878B;
	color: white !important;
	text-transform: none;
	font-family: PT Serif;
	font-size: 1.5em;
	padding: 0.1em 0.3em;
	margin: -0.3em -0.3em 0.3em -0.3em;
	width: 100%;
}
.greenbox.buzz h3 a { color: white !important; }
.greenbox.buzz h3 span {
	font-family: PT Sans;
	font-size: 0.5em;
	float: right;
	padding-top: 1em;
	opacity: 0.8;
}
.buzz .date { color: #999; font-family: PT Sans; text-transform: uppercase; font-size: 0.7em; padding-bottom: 0.2em; }
.buzz .date a { color: #999; }
.buzz .date .section { background-color: #FBAD39; color: white; padding: 2px 4px; }
.buzz .date .section:before { font-family: Verdana; content: "\25CB \25CB"; letter-spacing: 0.2em; }
.buzz h4 { padding-bottom: 0.2em; }
.buzz p { font-size: 0.8em; }
.buzz .item { margin-bottom: 0.5em; }

.buzz_week .date { margin-top: 0.3em; }
.buzz_week h4 { font-family: PT Serif; font-size: 1.3em; font-weight: normal; }

/* ---- Blue highlight box ---- */

.highlightbox {
	background-color: #18819B;
	font-family: PT Sans;
	color: white;
}
.highlightbox h3,.highlightbox h3 a {
	font-family: PT Serif;
	color: white !important;
}
.highlightbox a {
	color: white !important;
}
.highlightbox:after {
	border-top: 1px solid #DD5A31;
}

/* ---- Blue-topped intro box ---- */

.introbox h3 {
	color: white !important;
	z-index: 1;
	position: relative;
	padding-bottom: 1em;
}
.introbox>div>*:first-child:before {
	content: "\201C";
	font-size: 5em;
	float: left;
	height: 0.1em;
	padding-right: 0.1em;
	margin-top: 0.4em;
	color: #18819B;
}
.introbox:after {
	content: "";
	border-top: 2.8em solid #18819B;
	left: 0; top: 0; right: 0; bottom: 0;
	pointer-events: none;
}

/* ---- Green-topped feature box ---- */

.featurebox {
	background-color: #343434;
	color: white;
}
.featurebox h3 {
	color: white !important;
	z-index: 1;
	position: relative;
	padding-bottom: 1em;
}
.featurebox h3 a { color: white !important; }
.featurebox .date {
	margin-top: -3.2em;
	margin-bottom: 1em;
	text-align: right;
	z-index: 1;
	position: relative;
	color: white;
}
.featurebox:after {
	/* we use this in preference to the greenbox padding/margin solution, to avoid rounding errors */
	content: "";
	border-top: 2.8em solid #199662;
	left: 0; top: 0; right: 0; bottom: 0;
	pointer-events: none;
}


/* ---- Orange-topped black content box ---- */

.blackbox,.blackbox_noafter {
	background-color: black;
	color: white;
	font-size: 1.2em;
	line-height: 1.1em;
	padding: 0.5em 0.5em 0.4em 0.5em;
}
.blackbox .leadout, .blackbox .leadout a,
.blackbox_noafter .leadout, .blackbox_noafter .leadout a {
	color: #FBAD39;
	font-size: 1em;
	font-weight: normal;
}
.blackbox:after {
	content: "";
	border-top: 7px solid #51878B;
	left: 0; top: 0; right: 0; bottom: 0;
	position: absolute;
	pointer-events: none;
}
.stack>.blackbox { border-top: 7px solid #51878B; padding-top: 0.2em; }
.stack>.blackbox:after { border-top-width: 0; }

/* ---- Misc boxes ---- */

.darkgreenbox {
	background-color: #A0AA90;
	padding: 0.5em;
	color: white;
}
.darkgreenbox a {
	color: white;
}

.small_content { font-size: 0.8em; }
.small_content h4 { color: #777 !important; }

/* ---- Unboxed cross headline ---- */

h2.cross { padding: 0.3em 0.3em 0 0.3em; }

/* ---- Trailers for further content ---- */

.trailer { background-color: #DEE6D4; clear: both; }
.trailer>div { width: 100%; }
.trailer>div>div { display: inline-block; }

.trailer .title_strong {
	color: white;
	font-family: Nevis;
	text-transform: uppercase;
	letter-spacing: 3px;
	background-color: #A0AA90;
	padding: 0.5em;
}
.trailer.multiline .title_strong { vertical-align: top; }
.trailer .strong { padding: 0 0.5em; font-family: PT Sans; }
.trailer.multiline .strong { padding: 0.5em 0.5em; }

.trailer .title_medium {
	font-family: PT Sans Narrow;
	text-transform: uppercase;
	background-color: #D1DBC3;
	padding: 0.5em;
}
.trailer .medium {
 	padding: 0 0.5em;
	font-family: PT Serif;
}

/* Front page top trailer */

.trailer.front_banner>div>div:first-child {
	padding-left: 1em;
	width: 32%;
}
.trailer.front_banner { overflow: hidden; max-height: 2.2em; margin-top: -8px; }
.trailer.front_banner>* { border-top-width: 0; padding-left: 0.3em; }
.trailer.front_banner .topic_date { padding-left: 0.4em; }
.trailer.front_banner .title_medium { margin-left: -0.3em; margin-right: 5px; }

.trailer.front_banner .medium {
	vertical-align: text-bottom;
	max-height: 1.4em;
	display: inline-block;
}
.tag {
	display: inline; 
	font-family: PT Sans Narrow;
	text-transform: uppercase;
	color: white;
	background-color: #A0AA90;
	font-size: 0.9em;
	padding: 0.1em 0.4em; 
}
.tag a { color: white; }
.tag a:hover { text-decoration: underline; }

.trailer .login {
/*	z-index: 1;
	position: relative;*/
	float: right !important;
	display: block;
	font-family: PT Sans Narrow;
	text-transform: uppercase;
	color: #AAA;
	padding: 0.5em 0.5em 0.5em 0;
	background-color: #DEE6D4; 
}

/* ---- Full-width warning ---- */

#cross_warning {
}
#cross_warning>div {
    border-width: 0 8px 8px 8px;
    padding: 16px;
    background-color: #ffcc00;
    color: black;
    font-family: PT Sans;
    width: 100%;
    letter-spacing: 0em;
    padding-left: 2em;
}
.pling { float: left; font-size: 2em; padding-right: 10px; margin: -0.2em 0 0 -0.2em; }

/* ---- Full-width pic header ---- */

#header {
	background-size:cover;
	margin-bottom: 10px;
	background-position: right top;
}
.front #header { margin-bottom: 0; margin-top: 0.5em; }

#header>div {
	position: relative; padding: 0;
}
#header .intro {
	width: 33%;
	min-width: 300px;
	margin: 0.5em;
	padding: 0.5em;
}
.front #header .intro, .city #header .intro { min-height: 0; padding: 0; }
.front #header .intro>div, .city #header .intro>div {
	padding: 0.5em;
	background: white;
	background: rgba(255,255,255,0.93);
}
.login_bar { background-color: #DEE6D4 !important; padding-top: 0.2em !important; }
.login_bar img { vertical-align: bottom; padding-left: 3px; }

#header .coverline {
	position: absolute;
	color: white !important;
	bottom: 0.7em; left: 1em;
	border-width: 0px;
	z-index: 1;
}

/* ---- Full-width banner header ---- */

#banner {
	background: #51878B;
	text-align: center;
	padding: 1em 2em;
	margin-bottom: 10px;
	margin-top: 10px;
}
.city #banner { margin-top: 0; }
#banner h2 { color: white; font-weight: normal; font-size: 1.5em; padding: 0.5em; }
#banner p { color: white; padding: 0.5em; max-width: 40em; }
#banner a { color: white !important; }

.call_to_action { 
	font-family: Nevis; 
	text-transform: uppercase; 
	font-size: 0.7em; 
	letter-spacing: 2px;
}
.call_to_action:before {
	content: url('../site_images/pen.png');
	margin-right: 8px;
	position: relative;
	top: 2px;
}

/* ---- Articles ---- */

.article { padding: 0.5em 1em 0.5em 1em; }
.article img { max-width: 100%; }

.article>h2 {
	font-size: xx-large;
	color: black !important;
	font-weight: normal;
	padding: 0;
}
.article .date {
	background-color: #DEE6D4;
	border-width: 0 8px;
	padding: 0.15em 0.4em;
	width: auto;
	font-family: 'PT Sans Narrow'; text-transform: uppercase; font-size: small;
	display: inline;
}
.article .attrib, .embedded.attrib { color: #999; font-size: 0.8em; padding-top: 0.4em; border-width: 0 8px; font-family: 'PT Sans'; }
.article .attrib a, .embedded.attrib a { color: #999; font-weight: bold; }
.article .meta { border-width: 0 8px; }
.previous_story, .next_story {
	text-align: center;
	width: 45%; 
	max-width: 45%;
	font-family: 'PT Sans';
	font-size: small;
	border-top: 1px solid #CCC;
	padding-top: 0.3em;
	margin-top: 1em;
}

.embedded.attrib { padding-top: 0; padding-bottom: 0.5em; margin-top: -0.5em; }

.journey_trail {
	max-width: 31.6em !important;
	text-align: justify; cursor: pointer;
	border-top: 2px solid #CCC;
	border-bottom: 2px solid #CCC;
	padding: 0.7em;
	background-color: #F3F3F3;
	color: gray;
	min-height: 128px;
	margin: 0.2em 0 0.5em 0;
}
.journey_trail span { display: block; padding-bottom: 0.5em; }
.journey_trail img { display: inline-block; float: left; max-width: 256px !important; max-height: 128px !important; margin-right: 10px; }
.journey_trail span.header { font-size: 1.2em; font-weight: bold; padding-bottom: 0.5em; color: #2F915B; font-family: 'PT Sans';}
.journey_trail span.header:hover { text-decoration: underline; }
.journey_trail a { color: gray !important; }

/* ---- Article decoration ---- */

.story_links {
	width: 100% !important;
	display: inline-block;
}
.previous_story:before, .next_story:before {
	font-family: Verdana;
	content: "\25CB \25CB";
	color: #DD5A31;
	display: block;
	padding-bottom: 3px;
text-align: center;
}
.previous_story { float: left;}
.next_story { float: right; }

.pull_quote {
	float: left;
	margin: 0.2em 0.5em 0.4em 0;
	font-size: large;
	font-family: 'PT Serif';
	font-style: italic;
	color: #51878B;
	width: 40%;
	max-width: 200px;
}
.pull_quote.right { padding-left: 1em; }

/* ---- Summary items ---- */

.summary_image { display: table-cell; vertical-align: top; padding-right: 1em; padding-bottom: 0.5em; }
.summary_text { display: table-cell; vertical-align: top; }

/* ---- Journey management page ---- */

#bulk_action_menu { float: right; margin: 6px 8px 0 0;}
#groups_modal > div { max-width: 400px; }

/* ---- Forums ---- */

.pager_nav {
	background-color: #DEE6D4;
	border-top-width: 0; border-bottom-width: 0;
	line-height: 1.5em;
	font-family: 'PT Sans';
}
.pager_nav>.legend, .pager_nav .call_to_action, h3.action .call_to_action {
	display: inline-block;
	height: 100%;
	padding: 2px 0.8em;
	font-family: Nevis;
	text-transform: uppercase;
	font-size: small; 
	letter-spacing: 3px;
}
.pager_nav>.legend { background-color: #D1DBC3; }
.pager_nav .call_to_action, .greenbox h3 .call_to_action {
	float: right;
	color: white;
	background-color: #A0AA90;
}

.pager_nav .option {
	color: #999;
	border-right: 1px solid #AAA; 
	display: inline-block;
	height: 100%;
	padding: 2px 0.4em 2px 0.2em;
}
.pager_nav .option a { color: #999; }
.pager_nav .option.selected {
	color: white;
	background-color: #A0AA90;
	border-right-width: 0;
	padding-left: 0.4em;
}
.pager_nav .option.selected a { color: white; }

.forum_index { 
	width: 100%;
	display: table;
	background-color: white;
	border-top-width: 0; border-bottom-width: 0;
	border-collapse: collapse;
}
.forum_index tr:nth-child(even) {
    background-color: #F2F2F2;
}
.forum_index.unalt tr:nth-child(even) { background-color: white; }
.forum_index td { padding: 1px 6px; }
.forum_index th {
	background-color: white;
	padding: 10px 6px 6px 6px;
	font-family: 'PT Sans Narrow'; text-transform: uppercase; font-weight: normal; color: #CCC; 
	font-size: small;
	text-align: left;
}
.forum_index th h3 { color: black; font-weight: bold; padding-top: 1em; padding-bottom: 0; }
.forum_index tr th:first-child {
	color: #51878B;
	font-weight: bold;
}
.forum_index tr:last-child td {
	padding-bottom: 8px;
}
.forum_index .attrib { font-style: italic; font-size: small; }
.forum_index .count { text-align: center; }
.unboxed>.forum_index { border-width: 0; margin-bottom: 1em; }

.important_callout {
	border: 8px solid red; background-color: #FEE; padding:8px; margin-top: 10px;
}
.important_callout h4 { color: red; }

/* Table-like call to action for greenbox */
.greenbox h3.action { padding: 0; }
.greenbox h3.action>span { display: inline-block; padding: 0.5em 0 0 0.5em; }
.greenbox h3.action>* { padding: 0.3em; margin: 0; height: 1.5em; }

/* ---- Hero image ---- */

.hero { position: relative; color: white; }
.hero img { border-bottom-width: 0 !important; z-index: 0; }
.hero .coverline {
	position: absolute; bottom: 1em; left: 1.5em;
	border-width: 0px;
	z-index: 1;
}
.hero .slogan {
	position: absolute; bottom: 1.5em; right: 1.5em; 
	text-align: right;
	border-width: 0px;
	z-index: 1;
	line-height: 1;
	text-shadow: #444 2px 2px 2px;
}
.coverline h2, .hero h2 { font-weight: normal; font-size: x-large; color: white !important; padding-bottom: 0; }
.sectionline {
	font-family: PT Sans Narrow;
	text-transform: uppercase;
	font-size: 0.7em;
	font-weight: bold;
	background-color: #51878B; /* *** theme this: city/route/otherwise */
	padding: 2px 5px 1px 5px;
	margin-bottom: 2px;
	display: inline-block;
}

.hero .headline {
	position: absolute; bottom: 0; left: 0;
	border-width: 0px;
	z-index: 1;
	background-color: rgba(255,255,255,0.3);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#50ffffff', endColorstr='#50ffffff');
	text-shadow: #444 1px 1px 1px;
}
.hero .headline h2 {
	font-size: xx-large;
	line-height: 1.2em;
	color: white !important;
	margin: 0.2em 0 0.3em 1em;
}
.tag_inverse.hero .headline h2 { color: black !important; }

/* ---- Remove spacing for run-on pages ---- */

.run_on #header { margin-bottom: 0; border-bottom: 10px solid white; }
.run_on #footer { margin-top: 0; }
.city.run_on .hero img,
.route.run_on .hero img { border-top-width: 0; }
.run_on .hero img { padding-bottom: 0; border-bottom: 10px solid white; }

/* ---- AJAX login ---- */

#login_dialog table { padding-bottom: 5px; }
#login_dialog .social { background-color: #2E7993; }
.ajaxLoginPrompt { color: #2E7993; font-weight: bold; cursor: pointer; }
.ajaxLoginPrompt:hover { text-decoration: underline; }

/* ---- Contribution pages ---- */

#write_intro { max-width: 40em; }

/* ---- City specific ---- */

.city_call { font-size: 1em; line-height: 1.2em; }
.city_action { font-size: 0.9em; }
.city_action span { 
	display: inline-block;
	border-radius: 50%;
	width: 1.1em; height: 1.1em; font-size: 0.8em;
	padding-left: 1px;
	background: #51878B; color: white;
	text-align: center;
	font-family: PT Sans;
	margin-right: 5px;
}
.sans_link { font-family: PT Sans; font-weight: bold; }
.sans_link_small { font-family: PT Sans; font-weight: bold; font-size: 0.8em; }
.ncn_link { padding-bottom: 3px; }
.ncn_list { font-family: PT Sans; font-size: 0.8em; line-height: 1.2em; }
.excursion { font-family: PT Sans; font-size: 0.8em; border-bottom: 1px solid #CCC; padding: 0.3em 0 0.6em 0; margin-bottom: 0.2em; }
.excursion a { font-weight: bold; }
.excursion>img { float: left; }
.excursion>div { margin-left: 50px; }
.excursion_header { color: black; }

.cities_list, .cities_list li { list-style: none; list-style-type: none; padding: 0; margin: 0; }

#city_travelogue { margin-bottom: 0.5em; }
#city_options { padding-left: 1.5em; margin-bottom: 0.5em; font-style: italic; }
#city_options input { margin-left: 1em; }

table.route_summary_list { width: 100%; margin-bottom: 0.7em; }

/* ---- Route guide specific ---- */

/* Intro page */

.narrative { display: block; border-bottom-width: 0; }
.narrative p { max-width: 36em; text-align: justify; }
.narrative div.trail { 
	max-width: 31.6em; /*36em*0.9em-2*0.4em*/ 
	text-align: justify; padding: 0.4em; margin-top: 1em; cursor: pointer;
	background-color:#EB632B; color:white;
}
.narrative div.trail * { color: white }
.narrative .oversize { max-width: 44em; overflow: hidden; }
.narrative ul, .narrative ol { max-width: 33.3em; text-align: justify; margin-top: 0; margin-bottom: 0.5em; }
.narrative.right p { float: right; max-width: auto !important; }
.narrative img { max-width: 100%; max-height: 100%; }

.route_numbers {
	padding-bottom: 0.5em;
}
.route_numbers>span, .ncn_number {
	font-family: Helvetica, Arial;
	font-weight: bold;
	font-size: 0.8em;
	padding: 1px 3px;
	border-radius: 3px;
	-webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box;
	background-color: red;
	color: white !important;
	border: 1px solid white !important;
	font-style: normal !important;
}

/* Guide page */

#stage_number {
	border-left-width: 0;
	position: absolute;
	left: -8px; top: 20px;
}
#stage_number>span {
	background-color: #EEAD2E;
	font-size: x-large;
	padding: 0.7em 1.1em;
	color: white;
}
#stage_description { padding-left: 5em; border-left-width: 0; padding-bottom: 1em; }
#stage_description h3 { font-family: PT Sans; }
#stage_text { border-bottom: 1px solid #CCC; padding-bottom: 1.5em; }
#stage_text p { text-align: justify; }
#stage_text h3 { color: black; }

#stage_shops         { padding-top: 1em; float: left; width: 48%; }
#stage_accommodation { padding-top: 1em; float: right; width: 48%; }

.stage_link { font-family: PT Sans; color: #999; font-size: 0.9em; padding: 0.2em 0; }
.stage_link a { color: #999; }
.stage_link:before {
	font-family: Verdana; 
	content: "\25CB\25CB"; letter-spacing: 0.1em;
	margin-left: -5em; width: 4.8em; padding-right: 0.2em; display: inline-block; text-align: right; 
	color: #DD5A31;
}

.stage { display: none; }

/* Route list */

.index_attrib { color: #999; font-size: 0.8em; padding: 0.4em 0; border-width: 0 8px; font-family: 'PT Sans'; }

/* ---- Splash download page ---- */

.splash { text-align: center; padding: 2em 0; }
.splash>img {
	width: auto;
	display: inline-block;
}
.splash h2 { color: black !important; font-size: x-large; font-weight: normal; }
.splash p { max-width: 40em; }
.splash input[type=button] {
	color: white; background-color: #EEAD2E; width: auto; border-width: 0; font-size: 1.5em;
	padding: 0.5em; 
	font-family: PT Sans;
}

/* ---- Dialogue box-type page ---- */

.dialogue {
	display: table;
	position: absolute;
	top: 0; left: 0;
	height: 100%; width: 100%;
	z-index: -1;
}
.dialogue>div {
	display: table-cell;
	vertical-align: middle; border-width: 0;
}
.dialogue_box {
	max-width: 20em;
	margin-left: auto; margin-right: auto;
	border-top: 1px solid #CCC;
	background-color: white;
	padding: 1em 1em;
	text-align: center; 
}
.dialogue_box h3,
.dialogue_box h4,
.dialogue_box p { font-weight: normal; padding-bottom: 1em; }
.dialogue_box h4 { padding-top: 1em; }
#login_form table { margin-left: auto; margin-right: auto; padding-bottom: 0.5em; }
#login_form tr { text-align: left; min-height: 1.8em; }
#login_form td { padding-right: 1em; }

input[type='submit'], button, a.buttonlink { 
	border: 0; padding: 0.2em 0.5em; 
	color: white; 
	background-color: #FBAD39;
	font-family: 'PT Sans'; font-weight: bold; font-size: small;
	cursor: pointer; 
}
.dialogue_box button { background-color: #2E7993; }
.dialogue_box button:hover { color: #FF8; }

.form_hint { font-size: 0.8em; line-height: 1.4em; font-style: italic; color: #999; padding-bottom: 10px; padding-top: 2px; }
.form_warning { color: red; }
.hi907 { display: none; }
#upload_select_list { text-align: left; margin-bottom: 1em; }

/* ---- Front-page route-planner header ---- */

#planner_trailer>div {
	height: 300px;
	font-family: PT Serif; text-align: center; color: white; font-size: 1.2em;
	text-shadow: #444 0px 0px 8px;
	background-position:center;
}
#planner_trailer h2 {
	font-family: nevis;
	font-size: 1.5em;
	text-transform: uppercase;
	color: white;
	letter-spacing: 5px;
	margin-top: 100px;
}
#planner_trailer input[type=text] {
	width: 110px;
	vertical-align: middle;
	margin-bottom: 5px;
	height: 1.4em;
	font-size: 0.8em;
}
#planner_trailer input[type=submit], #planner_trailer button {
	background-color: #2F915B;
	padding: 1px 0.3em;
	font-size: 0.7em;
	vertical-align: middle;
	margin-bottom: 5px;
	border: 2px solid #7A7;
}
#planner_trailer input[type=submit]:hover, #planner_trailer button:hover { background-color: #7A7; }
#planner_trailer {
	margin-bottom: 8px;
}
#planner_trailer a { color: white; text-decoration: none; }
#inspired_input { margin-top: 10px; }
#inspired_input>div { display: inline-block; vertical-align: middle; line-height: 1.7em; }
#inspired_input>div:first-child { margin-right: 1em; }
#inspired_input button { min-width: 6em; display: inline-block; }

/* ---- GPS export ---- */

#app_button { font-size: 1.2em; margin-left: 0; }
#gps_direct,#gps_save { font-size: 0.8em; opacity: 0.9; }
#elevation_available,.gps_help,#turns_unavailable { font-size: 0.8em; opacity: 0.9; font-style: italic; }
#turns_unavailable { display: none; }
#gps_link { width: 200px; height: 14px; vertical-align: middle; overflow: hidden; }
#gps_open_options { margin-top: 1em; text-align: right; font-family: PT Sans; color: #51878B; cursor: pointer; font-weight: bold; }
#gps_more { display: none; }
#embed_textarea { 
    border: 2px solid gray; background-color: #F7F7F7; width: 100%; height: 80px;
    font-family: monospace;
}
#embed_height { width: 30px; }
/*.garmin_hide { visibility: hidden; }*/

/* ---- User pages ---- */

.profile { border-top-width: 8px; }
.profile .image { display: inline-block; width: 25%; max-width: 18em; vertical-align: top; padding-right: 1em; }
.profile img { width: 100%; }
.profile .description { display: inline-block; width: 70%; }
#preferences_form td { padding-bottom: 4px; padding-right: 10px; }
#preferences_form input[type=number] { width: 40px; }

.user_specific { display: none; } /* overridden by user_123 */
.logged_in { display: none; }
.logged_out { display: block; }
span.logged_out { display: inline; }
.admin_inline { display: none; }

.editable_headline {
	font-size: 1.5em;
	font-family: PT Serif;
	padding: 3px;
	min-width: 480px;
}

/* ---- Styling for narrative sections ---- */

img.float_left  { width: auto; margin: 0em 1em 0.5em 0; float: left; }
img.float_right { width: auto; margin: 0em 0 0.5em 1em; float: right; }

p.float_left  { display: inline; width: auto; margin: 0em 1em 0.5em 0.5em; float: left;  }
p.float_right { display: inline; width: auto; margin: 0em 0.5em 0.5em 1em; float: right; }
p.float_left img, p.float_right img { max-width: 100%; }

/* ---- Forms ---- */

form.sectioned>div { margin-top: 1em; }
form.sectioned>div.dotted { border-top: 1px dotted gray; padding-top: 1em; }

input.large {
	font-size: large;
	padding: 0.5em;
	width: 30em;
	max-width: 93%;
}

form.dotted {
	border-left: 1px dashed gray;
	background-color: #F0F9F9;
	padding: 0.5em 0.5em 0.5em 1em;
	font-style: italic;
	margin-bottom: 1em;
}
form.dotted>input[type='submit'] {
	margin-top: 1em;
}
.wym_classes { display: none !important; }

/* ---- Universal text styles ---- */

.from {
	color: #888;
	font-family: Nevis;
	font-size: 0.5em;
	letter-spacing: 2px;
	text-transform: uppercase;
}

/* ---- Comments ---- */

#comments {
	padding-top: 2em;
	width: 100% !important;
}

.comment { 
	width: 100%;
	border-top: 1px solid #CCC;
	padding: 0.5em 0 0.5em 0;
}
.comment_attrib { 
	font-family: PT Sans;
	font-size: 0.8em;
	float: left;
	width: 25%;
}
.comment_delete { cursor: pointer; }
.comment_body { 
	font-family: PT Serif;
	margin-left: 25%;
	vertical-align: top;
	min-height: 3em;
	border-left: 1px solid #CCC;
	padding-left: 1em;
}
.comment_body>* { font-size: 0.8em; line-height: 1.5em; }
.comment_name { font-weight: bold; }
.comment_date,.comment_delete { color: #AAA; }

#comment_edit { padding-top: 1em; }
.comment_fragment_edit { border-top: 1px solid #CCC; padding-top: 0.5em; }

.favourite_control { cursor: pointer; }

/* ---- Search ---- */

.search_results { padding-bottom: 1em; }
.search_results h3 { padding-bottom: 0.2em; }
.box .pager_nav { margin: 0 -10px -10px -10px; }
.search_typo { padding-bottom: 1em; font-style: italic; }
.search_typo a { color: #FBAD39; }
.search_results .section { padding: 0.5em 0 0.1em 0.1em; }

/* ---- Single image (404 etc.) ---- */

.single_image {
	padding: 1em 0;
	text-align: center;
}

/* ---- Listings ---- */

.book_affiliate      { padding: 0.5em 0; font-family: 'PT Sans'; line-height: 2em; }
.link_nonaffiliate   { padding: 0.2em 0; font-family: 'PT Sans'; font-size: small; }
.book_affiliate a    { background-color: #FBAD39; color: black; padding: 2px 0.3em; margin-right: 10px; }
.link_nonaffiliate a { background-color: #9AA588; color: white; padding: 2px 0.3em; margin-right: 10px; }
a.add_shortlist		 { background-color: #9AA588; color: white; padding: 2px 0.3em; cursor: pointer; white-space: nowrap; }

.listing_header { 
	font-family: 'PT Sans'; font-size: smaller; color: #666;
	margin-bottom: 1em; border-bottom: 1px solid #CCC !important; padding-bottom: 0.5em;
	cursor: pointer;
}
.listing_header:hover { text-decoration: underline; }
.listing_description { font-size: small; padding-bottom: 0.5em; }
.listing_name { font-family: 'PT Sans'; font-weight: bold; }
.listing_town { font-family: 'PT Sans'; font-weight: bold; }
.listing_address, .listing_provides { font-family: 'PT Sans'; font-size: small; }
.listing_address { padding-bottom: 0.5em; }
.listing_provides span { text-transform: capitalize; }
.listing_logos { padding: 0.5em 0; }
.listing_logos img { padding-right: 1em; max-width: 60px; }

.listing_image { float: left; padding-right: 10px; }
.listing_image img { max-width: 200px; max-height: 200px; }

.listing_details div { font-family: 'PT Sans'; font-size: small; line-height: 2em; }
.listing_details .category { font-weight: bold; }

/* Sidebar listings */

.list { font-size: 0.9em; }
.list .town { font-weight: bold; padding: 0.5em 0; }
.list .item .number { display: block; float: left; }
.list .item .name { display: block; padding-left: 25px; }
.list .item .price { display: block; float: right; color: #999; }

/* Guide page listings */

.summary_list h4 { margin-top: 0.3em; }
.summary_list .item { font-size: 0.9em; font-family: PT Sans; }
.summary_list .item .name { display: block; }
.summary_list .item .info { display: block; float: right; color: #999; }
.summary_list { padding-bottom: 1em; }
.summary_list .row_0 { border-top: 1px solid #EEE; border-bottom: 1px solid #EEE; }
.images_grid { padding-top: 1em; padding-bottom: 0.5em; }

/* Listing pages */

.listing_full_image {
	width: 48%; max-width: 170px; display: inline-block; padding-right: 2%;
}

/* YHA layout */

.ride_list { width: 48%; float: left; }
.ride_list.first { margin-right: 20px; }

/* Shortlist */

.shortlist p { font-size: 0.8em; }

/* ---- Explore ---- */

.loading { background-color: #E3E3E3; text-align: center; }
.loading a { font-weight: bold; font-family: PT Sans; }
#none_found { display: none; }
#none_found div { text-align: center; }
.destination_details, .destination_info { font-family: PT Sans; font-size: 1em; }
.destination_info { border: 4px solid #CCC; }
.destination_details a { font-weight: bold; }
.also_here { font-style: italic; font-size: 0.8em; }
#listing_description { display: none; } /* map page */
/*.destination_details img { float: left; padding-right: 10px; }*/
/*.destination_details>div { margin-left: 50px; }*/
.destination_logo { width: 50px; display: table-cell; vertical-align: top; }
.destination_summary { display: table-cell; }
.explore_map { margin-top: 0.7em; }
.route_rating { display: inline-block; }
#distance_controls, #type_controls { color: white; padding: 0.5em; font-size: 0.9em; }
#refreshButton { margin-left: 1em; }
#distanceSlider { width: 100px; }
#explore_header { margin-bottom: 5px; }
#explore_header_start { font-size: 1.5em; color: white; vertical-align: bottom; padding-right: 8px; }
.explore_place { font-size: 1em; padding: 2px 5px; max-width: 9em; font-family: PT Sans; opacity: 0.95; }

#explore_recs { margin-bottom: 2em; }
#explore_recs div h3 { padding-bottom: 0; font-weight: normal; font-size: 1.5em; }
#explore_recs p.starting { padding-bottom: 12px; }
#explore_recs p.starting span { font-family: Nevis; text-transform: uppercase; }
#explore_recs img { height: 207px; width: 310px; }
#explore_recs .image { height: 207px; width:310px; margin-bottom: 6px; }
#explore_recs .lh { position: absolute; background-color: black;   color: white; padding: 4px; font-family: Nevis; }
#explore_recs .rh { position: absolute; background-color: #DEE6D4; color: black; padding: 4px; font-family: Nevis; right: 7px; }

.crosshead_bleed { margin-bottom: 10px; width: 100%; display: table; }
div.crosshead_bleed div.bg { border-width: 0; background-color: #E8E8E8; width: 100%; left: 0; right: 0; position: absolute; min-height: 55pt; }
div.crosshead_bleed h1 { padding-left: 8px; font-size: 1.5em; font-family: Nevis; font-weight: normal; border-width: 0; vertical-align: middle; height: 45pt; display: table-cell; }
.crosshead_bleed span.rh { font-family: PT Serif; font-size: 0.7em; float: right; }
.shout div.bg { background-color: #FBAD39 !important; color: white; }
.shout h1 { text-align: center; }
.shout a { color: black; }
.shout a.cta { background-color:white;color:#FBAD39;padding:2px 8px;cursor: pointer; }
.shout a.cta:hover { color: black; }
.shout.colour2 div.bg { background-color: #2E7993 !important; }
.shout.colour2 a.cta { color: #2E7993; }
.ct_adb { display: none; } /* front page sponsored call to action */

#overnight_start { border: 2px solid white; }

/* Destinations */

.destination_info { background: #E3E3E3; padding: 3px; color: black; }
.destination_info a { font-weight: bold; }
.archies { font-size: 0.8em; }
.archies img { float:left; margin: 0 8px 0 2px; }
.archies a { letter-spacing: 1px; }
.listing_photo { max-width: 150px; max-height: 150px; margin: 2px 10px 2px 3px; float: left; }
.listing_summary { font-size: 0.8em; }
.listing_summary .listing_text { }
.destination_info .book_affiliate a { color: black; font-weight: normal; margin-left: 10px; }

/* ---- Gallery ---- */

.am-wrapper { float:left; position: relative; overflow: hidden; }
.am-wrapper img { position: absolute; outline: none; }
.gallery * { letter-spacing: -3pt; }
#lightbox {
	position: fixed;
	z-index: 11;
	top: 0; left: 0;
	width: 100%; height: 100%; 
	background-color: rgba(0,0,0,0.7);
	text-align: center;
	display: none;
}
#lightbox_container {
	width: auto;
	cursor: pointer;
    position: absolute;
    margin: auto;
	width: fit-content;
	height: fit-content;
	max-width: 100%;
	max-height: 100%;
    left: 0; right: 0;
    top: 0; bottom: 0;  
	border-radius: 3px;
	box-shadow: 0 0 25px #111;
	-webkit-box-shadow: 0 0 25px #111;
	-moz-box-shadow: 0 0 25px #111;
	padding: 0;
}
#lightbox img {
	max-width: 100%;
	padding-bottom: 0;
}
#lightbox_caption {
	position: absolute;
	bottom: 0;
	width: 100%;
	text-color: #444444;
	font-family: PT Sans;
	font-size: 0.8em;
	padding-top: 5px;
	background-color: rgba(255,255,255,0.95);
}

/* ---- Routing (most is in map.css, but this is required for the routeplanner embed) ---- */

.placename_input { width: 100%; }
.pn_prompt { float: left; width: 40px; font-size: 0.8em; padding-top: 2px; }

/* ---- Typeahead ---- */

.tt-query { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.tt-hint { color: #999; }
.tt-suggestion { padding: 0px 10px; }
.tt-suggestion.tt-cursor { color: #fff; background-color: #0097cf; cursor: pointer; }

.tt-dropdown-menu {
	font-style: normal !important;
	overflow: visible;
	font-family: PT Sans;
	text-align: left;
	color: black;
	text-shadow: none;
	width: 300px;
	margin: 0;
	padding: 2px 0 0 0;
	background-color: #fff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
	-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2); -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2); box-shadow: 0 5px 10px rgba(0,0,0,.2);
}
.acResult {
	border-bottom: 1px solid #BBB;
	margin: 0; padding: 4px 0 4px 0;
}
.acResult .acName {
	font-size: 0.8em;
	line-height: 1em;
	padding-top: 2px;
}
.acResult .acLocation {
	font-size: 0.6em;
	line-height: 0.8em;
	padding-top: 4px;
	color: #999;
}
.acCompact { border-bottom: 1px solid #BBB; margin: 0; padding: 6px 0 4px 0; line-height: 0.9em; }
.acCompact .acName { font-size: 1em; font-weight: normal; }
.acCompact .acLocation { font-size: 0.7em; font-weight: normal; color: #999; }

/* ---- Ads ---- */

.ad_container { }
.ad_container * {
    margin: 0 auto;
    margin-bottom: 8px;
}
.floating_ad_container {
	display: inline-block;
	float: right;
/*	background-color: #EEE; */
    margin-right: 8px; 
	margin-left: 1em; /* keep clear of content */
}

.ad_area { border-width: 0 !important; z-index: 110; }
.ad { text-align: center; } /* centre ad images */
.ad * { max-width: 100% !important; max-height: 100% !important; } /* shrink if necessary [not iframes] */
.ad img { width: auto; height: auto; } /* don't stretch */

/* ---- Utils ---- */

.review_table {
	width: 100%;
}
.review_table td { border-top: 1px solid #CCC; padding: 5px; vertical-align: top; }
.review_table td button { margin: 5px; }
.review_name { font-weight: bold; width: 20%; }
.review_friendly { color: red; }
.review_full { display: none; }

.ios_nozoom { font-size: 16px; }
.ios_autofill:-webkit-autofill { animation-name: onAutoFillStart; transition: background-color 50000s ease-in-out 0s; } /* clever hack to submit on autofill, see SO 11708092 */

/* ---- New-look front page ---- */

.front2 #top_nav { background-color: transparent; border-top-color: transparent; }
.front2 #sections>span { text-shadow: 0px 0px 5px rgba(0,0,0,0.7); }
#route_input_box {
	margin-top: 1em;
	margin-left: auto;
	margin-right: auto;
	display: table;
	padding: 1em;
	background-color: rgba(47,145,91,0.8);
	pointer-events: all;
}
#route_input_box>div {
	display: inline-block;
	vertical-align: top; 
	text-align: left; 
	color: white; 
	font-family: PT Sans; 
	font-weight: bold; 
	text-shadow: 0px 0px 5px rgba(0,0,0,0.7);
}
.route_fromto {
	font-size: 1.5em;
	padding: 2px 5px;
	max-width: 9em;
}
#route_to_div { margin-right: 2em; }
#route_expander { margin-top: 1em; display: none; }
#route_types { font-size: 1.2em; font-weight: normal; }
#route_expander>button { 
	color: black; font-size: 1.5em; width: 100%;
}
#fp_hero_content {
	position:relative; z-index: 20; margin-top:100px; background-color: none; border-width: 0px; min-height:500px;
	pointer-events: none;
}
#fp_headline1 {
	color: white; font-family: Nevis; font-size: 3em; text-shadow: 0px 0px 5px rgba(0,0,0,0.7); text-align: center;
	padding-left: 1em; padding-right: 1em;
	font-weight: 400;
}
#fp_headline2, #fp_headline3 {
	color: white; font-family: PT Serif; font-style: italic; text-shadow: 0px 0px 5px rgba(0,0,0,1); font-size: 1.5em; margin-top: 0.5em; text-align: center;
	padding-left: 1em; padding-right: 1em;
}
#fp_headline3 a { color: white !important; text-decoration: underline; }
#fp_quote {
	position:absolute; 
	top: 500px; background-color: #F9F7F2; padding-top: 1em; 
	text-align: center;
	padding-left: 0; padding-right: 0; left: 0; right: 0; width: 100%;
/*    z-index: 5000; */
/*	padding-left: 4em; padding-right: 4em; 
	left: auto; right: auto; max-width: 800px; */
}
#fp_quote>div {
	max-width: 85%;
	font-style:italic; font-size: 1.5em; color: #444;
}
#fp_dimmer {
	z-index:10;position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);display:none;
}
#fp_header_image {
	z-index:-1; height:500px; 
	background-position: center; background-size: cover; 
	position: absolute; left: 0px; right: 0px; top: 0px; 
}
#fp_accommodation_link { display: none; }
/* coast */ .hero1 { background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAA0JCgsKCA0LCgsODg0PEyAVExISEyccHhcgLikxMC4pLSwzOko+MzZGNywtQFdBRkxOUlNSMj5aYVpQYEpRUk//2wBDAQ4ODhMREyYVFSZPNS01T09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0//wAARCAAYACgDASEAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAIEAwX/xAAoEAACAgIAAwcFAAAAAAAAAAABAgMEABEhMUEFEiIyUXGBNUKRodH/xAAZAQACAwEAAAAAAAAAAAAAAAACBQADBAH/xAAfEQACAgICAwEAAAAAAAAAAAAAAQIDERITMSFBUaH/2gAMAwEAAhEDEQA/AO8afrmMUUM+zC6uF5kZs5RdxPGR2qcPLkktM+mHC0FxZM1Jt+XDNKuQDTOhLLLYj7jTjR561xxq0rRhxF4FXgdqBvXUYoeiltkYp2OGmoC9JJOIY5AWKd8+EcB0xZZbP2yJ+BhqyH0rlXYnjBBPbtR85Ix76wy5W147K3XL2jpih2aAwe6jgjWi6jj8ZilalWsbVxJsDTCRNL0IAJ5YsShFYbGDm35EmgRm28vfHAgGeNdH3ytVpPGC9xUbqBKra/WC1W12dU5GElbsuQ/UR8Ov8wwdYff0m7P/2Q=="); }
/* Kent  */ .hero2 { background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAA0JCgsKCA0LCgsODg0PEyAVExISEyccHhcgLikxMC4pLSwzOko+MzZGNywtQFdBRkxOUlNSMj5aYVpQYEpRUk//2wBDAQ4ODhMREyYVFSZPNS01T09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0//wAARCAAbACgDASEAAhEBAxEB/8QAGQAAAgMBAAAAAAAAAAAAAAAAAwQAAgUG/8QALBAAAgEDBAEBBgcAAAAAAAAAAQIDAAQRBRIhMUEiExQVYYGhMjRCUXGxwf/EABgBAAMBAQAAAAAAAAAAAAAAAAECAwQA/8QAIREAAgEDBAMBAAAAAAAAAAAAAAECAwQhERITMUFRcZH/2gAMAwEAAhEDEQA/AOijtl+VMJbgftW11DEqYzHEi8nk0yjRj9AqE5NmiEUgu5B0BUqeSuDi4NXu2jDrGGUnG4R8f3TDaleZGHWMDyYs5+9ZJ366Sz9Hja+2XXUrhlLCdCQDlRH19aqur3kaQ72tZDMm9B6kOOeDxjNSVzUlFy9FOKCehSbW9STdstUc9gLID/lSirt+WvwLoLwjJheNE2Ko/hfFGiIlwiszE9+qsO3OrKtroJcXa2iBWhmfkAlEzmkrC2HwgRSqxAJ7zzz3z1V0tIE3mQrJcXOnsPxTQeRu9SfXzUocO7KG5NMMMiL7RhjjA4rU05V91zjnJpX2dFZBqTv7PINWT8wAemU5+dMugIRuQMgYGN2PtUpkFH//2Q=="); }
/* woods */ .hero3 { background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAA0JCgsKCA0LCgsODg0PEyAVExISEyccHhcgLikxMC4pLSwzOko+MzZGNywtQFdBRkxOUlNSMj5aYVpQYEpRUk//2wBDAQ4ODhMREyYVFSZPNS01T09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0//wAARCAAZACgDASEAAhEBAxEB/8QAGQAAAwEBAQAAAAAAAAAAAAAAAAQFAwIB/8QAKhAAAgEDAgUDBAMAAAAAAAAAAQIDAAQREjEFIUFRYRNygRQyM8E0obH/xAAXAQADAQAAAAAAAAAAAAAAAAAAAQID/8QAHBEBAQEBAAIDAAAAAAAAAAAAAAERAgMxEiEi/9oADAMBAAIRAxEAPwCPHLHBD68Y0jZwTv5Hkf3T3DIdEbzzRlpZFOEYZCDHbyP1WW4pol8qLJEzEANkhum1eSXSTQzNHGMOjLpJzuMH5o0J/wBXIbSNBGhTRp1acMSPNFAZxiCa4tYhIyxY1MzJ1xtvV88OSWHEV6MHHMLvjalZaCr8Cle6ErzK6gdORzS13bLaGOJ7pg0kuNJXke4HnmKP1uYchS0tZMsk3qQuCSAwxy+aKnrr7KyqFrbRW6mWXJKjJJP6qhZTBbOIlQCw1Hl3OafF3auz4zGpucb7VI4jLHPcxFwJNDBhqBIX46jxWqZTaX6zxgtjsR5oqLzD1jxD+FJ7DTC/ij9gqfH6V5PbiTY1Nufyr7hWjOubb7G9zf7RQH//2Q=="); }

/* ---- Popups ---- */

.popup {
	/* http://codepen.io/shshaw/full/gEiDt */
	/* could make draggable: http://stackoverflow.com/questions/9334084/moveable-draggable-div-using-javascript */
	margin: auto;
	position: fixed;
	top: 0; left: 0; bottom: 0; right: 0;

	display: none;
	z-index: 10000;
	height: 65%;
	width: 65%;
	min-width: 300px;
	max-width: 700px;
	overflow: auto; 
	background-color: white;
	padding: 1em;
	-webkit-box-shadow: 2px 2px 5px 2px #444;
	-moz-box-shadow: 2px 2px 5px 2px #444;
	box-shadow: 2px 2px 5px 2px #444;
}

.popup_small {
	width: 300px;
	height: 260px;
}

.popup_smallish {
	width: 300px;
	height: 360px;
}
#gps_dialog { height: 380px; }

.popup div, .popup p { 
    border: 0px solid white;
}

.popup h3 {
	font-family: 'PT Sans';
	font-weight: bold;
	color: #51878B;
	border-width: 0;
	border-bottom: 1px solid #DDD;
	padding-bottom: 0.4em;
	margin-bottom: 0.5em;
}
.popup h3 a.close {
	float: right;
	font-size: 0.8em;
	color: black;
	cursor: pointer;
}

/* ---- Patreon ---- */

.support {
	background-color:rgb(250, 118, 100);
	padding:5px 8px;
	height:1.5em;
	cursor:pointer;
	color:white;
	font-weight:bold;
	font-family: 'PT Sans';
}
.support span {
	display:inline-block;vertical-align:top;padding-top:2px;margin-left:10px;letter-spacing:0.5px;font-size:1.2em;
}
#satUpsell { font-size: small; font-style: italic; max-width: 150px; line-height: 1.2em; margin-top: 8px; }

/* ---- Toastr ---- */

.toast-title{font-weight:700}.toast-message{-ms-word-wrap:break-word;word-wrap:break-word}.toast-message a,.toast-message label{color:#FFF}.toast-message a:hover{color:#CCC;text-decoration:none}.toast-close-button{position:relative;right:-.3em;top:-.3em;float:right;font-size:20px;font-weight:700;color:#FFF;-webkit-text-shadow:0 1px 0 #fff;text-shadow:0 1px 0 #fff;opacity:1.00;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);filter:alpha(opacity=80);line-height:1}.toast-close-button:focus,.toast-close-button:hover{color:#000;text-decoration:none;cursor:pointer;opacity:.4;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=40);filter:alpha(opacity=40)}.rtl .toast-close-button{left:-.3em;float:left;right:.3em}button.toast-close-button{padding:0;cursor:pointer;background:0 0;border:0;-webkit-appearance:none}.toast-top-center{top:0;right:0;width:100%}.toast-bottom-center{bottom:0;right:0;width:100%}.toast-top-full-width{top:0;right:0;width:100%}.toast-bottom-full-width{bottom:0;right:0;width:100%}.toast-top-left{top:12px;left:12px}.toast-top-right{top:12px;right:12px}.toast-bottom-right{right:12px;bottom:12px}.toast-bottom-left{bottom:12px;left:12px}#toast-container{position:fixed;z-index:999999;pointer-events:none}#toast-container *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}#toast-container>div{position:relative;pointer-events:auto;overflow:hidden;margin:0 0 6px;padding:15px 15px 15px 50px;width:300px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background-position:15px center;background-repeat:no-repeat;-moz-box-shadow:0 0 12px #999;-webkit-box-shadow:0 0 12px #999;box-shadow:0 0 12px #999;color:#FFF;opacity:1.00;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);filter:alpha(opacity=80)}#toast-container>div.rtl{direction:rtl;padding:15px 50px 15px 15px;background-position:right 15px center}#toast-container>div:hover{-moz-box-shadow:0 0 12px #000;-webkit-box-shadow:0 0 12px #000;box-shadow:0 0 12px #000;opacity:1;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter:alpha(opacity=100);cursor:pointer}#toast-container>.toast-info{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=)!important}#toast-container>.toast-error{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=)!important}#toast-container>.toast-success{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==)!important}#toast-container>.toast-warning{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=)!important}#toast-container.toast-bottom-center>div,#toast-container.toast-top-center>div{width:300px;margin-left:auto;margin-right:auto}#toast-container.toast-bottom-full-width>div,#toast-container.toast-top-full-width>div{width:96%;margin-left:auto;margin-right:auto}.toast{background-color:#030303}.toast-success{background-color:#51A351}.toast-error{background-color:#BD362F}.toast-info{background-color:#2F96B4}.toast-warning{background-color:#F89406}.toast-progress{position:absolute;left:0;bottom:0;height:4px;background-color:#000;opacity:.4;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=40);filter:alpha(opacity=40)}@media all and (max-width:240px){#toast-container>div{padding:8px 8px 8px 50px;width:11em}#toast-container>div.rtl{padding:8px 50px 8px 8px}#toast-container .toast-close-button{right:-.2em;top:-.2em}#toast-container .rtl .toast-close-button{left:-.2em;right:.2em}}@media all and (min-width:241px) and (max-width:480px){#toast-container>div{padding:8px 8px 8px 50px;width:18em}#toast-container>div.rtl{padding:8px 50px 8px 8px}#toast-container .toast-close-button{right:-.2em;top:-.2em}#toast-container .rtl .toast-close-button{left:-.2em;right:.2em}}@media all and (min-width:481px) and (max-width:768px){#toast-container>div{padding:15px 15px 15px 50px;width:25em}#toast-container>div.rtl{padding:15px 50px 15px 15px}}
.toast { border-width: 0 !important; font-family: 'PT Sans'; }
#toast-container.toast-bottom-center { text-align: center; bottom: 15px; }
#toast-container.toast-top-center { text-align: center; top: 15px; }