/*ALL EM CONVERSIONS BASED ON 16PX*/


/* =============================================================================================
	BASE STYLES AND LAYOUT
============================================================================================= */

/* ------------------------------------------------------------------------ @Font face */

@font-face {
    font-family: 'Clear Sans Regular';
    src: url('../fonts/ClearSans-Regular-webfont.eot');
    src: url('../fonts/ClearSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ClearSans-Regular-webfont.woff') format('woff'),
         url('../fonts/ClearSans-Regular-webfont.ttf') format('truetype'),
         url('../fonts/ClearSans-Regular-webfont.svg#clear_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Clear Sans Medium';
    src: url('../fonts/ClearSans-Medium-webfont.eot');
    src: url('../fonts/ClearSans-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ClearSans-Medium-webfont.woff') format('woff'),
         url('../fonts/ClearSans-Medium-webfont.ttf') format('truetype'),
         url('../fonts/ClearSans-Medium-webfont.svg#clear_sans_mediumregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Clear Sans Bold';
    src: url('../fonts/ClearSans-Bold-webfont.eot');
    src: url('../fonts/ClearSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ClearSans-Bold-webfont.woff') format('woff'),
         url('../fonts/ClearSans-Bold-webfont.ttf') format('truetype'),
         url('../fonts/ClearSans-Bold-webfont.svg#clear_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* ------------------------------------------------------------------------ Page Styles & Resets */

html {
    font-size: 100%; 
    overflow-y: scroll;
    -webkit-tap-highlight-color: rgba(0,0,0,0); 
    -webkit-text-size-adjust: 100%; 
    -ms-text-size-adjust: 100%; 
	 box-sizing: border-box;
	}
	
body {
	margin: 0;
	min-height: 100%;
	font: normal 100%/1.6 'Open Sans', Arial, Helvetica, sans-serif; 
	color: #111;	
	} 

	.Preload * { /* Transitions fire only after page load http://css-tricks.com/transitions-only-after-page-load/ */
		-webkit-transition: none !important;
			transition: none !important;
		}
		
*, *:before, *:after { box-sizing: inherit; } /*inherits border-box from html*/

article, aside, figure, footer, header, hgroup, menu, nav, section, main { display: block; }

p, ol, ul, li { margin:0; padding: 0 0 1em; }


/* ------------------------------------------------------------------------ Clearfix Hack: http://nicolasgallagher.com/micro-clearfix-hack/ */

.CF:before, .CF:after { 
	content: ""; 
	display: table; 
	}
	.CF:after { clear: both; }
	.CF { *zoom: 1;}
	
.Clear { clear: both; }

br.Clear {display: none;}

@media all and (min-width: 60em) {

	br.Clear {display: inline;}
}

		
/* ------------------------------------------------------------------------ Keyboard Accessibility */

.SkipLink { 
	position:absolute; 
	left:-10000px; 
	top:auto; 
	width:1px; 
	height:1px; 
	overflow:hidden;
	background: #2c4890;
	color: #fff;
	font-size: 0.875em;
	text-decoration:none;
	z-index: 100;
	} 
 
	.SkipLink:focus { 
		left:0;
		outline: none; 
		padding:0.375em 0.625em; 
		width:auto; 
		height:auto; 
		} 
		
a:focus, input:focus, select:focus, textarea:focus {outline: solid thin #9b191d; } /* outline shows with keyboard... */
	a:hover, a:active { outline: none !important; } /*...not with mouse (kinda) */
		

/* ------------------------------------------------------------------------ Headers */

h1, h2, h3, h4  { 	
	font-family: 'Clear Sans Regular', Arial, Helvetica, sans-serif;
	line-height:1.2;
	font-weight:normal; 	
	text-rendering: optimizeLegibility;
	margin:0;
	}	

	h1 {
		font-size: 2em; /*32px*/
		padding-bottom: 0.5em; /* 16px (consistent with p, ol, ul, li, img) */
		color: #FFF;
		text-transform: uppercase;
		letter-spacing: -0.025em;
		}
		
	h2 { 
		font-family: 'Clear Sans Bold', Arial, Helvetica, sans-serif;
		font-size: 1.625em; /*26px*/
		padding: 0.615em 0; /* 16px */
		color: #b72025;
		letter-spacing: -0.025em;
		}
		section h2:first-child,
		article h2:first-child { padding-top: 0; }
			section h2.First,
			article h2.First {padding-top:0; } /*IE8*/
			
	h3 { 
		font-family: 'Clear Sans Bold', Arial, Helvetica, sans-serif;
		font-size: 1.5em; /*24px*/
		padding: 0.667em 0; /* 16px */
		color: #b72025;
		}
		h3.HasUnderline {
		    border-bottom: 2px solid #323642;
		    padding: 0.667em 0 0.5em 0;
		    margin-bottom: 0.5em;
			}

	h4 { 
		font-family: 'Clear Sans Bold', Arial, Helvetica, sans-serif;
		font-size: 1.25em;
		padding: 0.667em 0; /* 16px */
		/*color: #b72025;*/
		}		
		
		h1 + h2, h1 + h3, h2 + h3  { padding-top: 0; }

	/*small dark text that goes inside/beside headings*/	
	.HeadingDetail {
		display: inline-block;
		font-size: 0.5em;
		font-size: 1rem;
		color: #111;
		margin: 0.5em 0;
		}	
		/*spacing between details*/
		.HeadingDetail .Stat {
			padding: 0 1em 0 0;
			}
		

@media all and (min-width: 60em) {	
		
	h1 { 
		font-size: 3.4375em; 
		padding-bottom: 0.333em; /* 16px */
		}
		
	h2 { 
		font-size: 2.625em;/*42px*/ 
		padding: 0.55em 0; /* 16px */
		}
		
	h3 { 
		/*font-size: 2.0em; */
		font-size: 1.85em;
		padding: 0.444em 0; /* 16px */
		}
		h3.HasUnderline {
			font-size: 1.85em;
		    padding: 0.444em 0 0.25em 0;
		    margin-bottom: 0.75em;
			}

	h4 { 
		font-size: 1.25em; 
		/*padding: 0.444em 0;*/
		padding: 0.5em 0;
		}	

	.HeadingDetail {
		margin: 0 0 0 1em;
		}	

		.HeadingDetail.FloatR {
			margin-top: 0.75em;
			}
			.HeadingDetail.FloatR.MT0-Desktop {margin-top: 0;}	

		.HeadingDetail .Stat {
			padding: 0 1em;
			}	
	
}	

				
/* ------------------------------------------------------------------------ Lists */

ul { 
	list-style: none; 
	list-style-position: outside;
	padding-left: .25em;
	}
	ul li {	
	    padding-left:1em;
		position: relative;
		background-image: url(../../images/arrow-right-white.svg);
		background-repeat: no-repeat;
		background-position: left 0.438em;
		background-size: 6px auto;
		}
			
ol { 
	list-style-position: outside;
	padding-left: 1.5em;
	}
	ol li { 
		padding-left:0; 
		background-image: none; 
		}
				

	li ul, li ol { margin: 0.875em 0 -.5em 0; }
	
		li:last-child {padding-bottom:0; }
			li.Last {padding-bottom:0; } /*IE8*/
			
					
/* ------------------------------------------------------------------------ Other Base Text Styles */

b, strong { font-weight: bold;}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
	}
	sup { top: -0.5em; }
	sub { bottom: -0.25em; }
	
.NoWrap { white-space:nowrap; }

.Note,
.SmallerFont {
	font-size: 0.9em;
	}	
		
.IntroText, .IntroTextSm { 
	font-size: 1.25em; /*20px*/
	padding-bottom: 0.800em; /* 16px */
	line-height: 1.4;
	}

/*semibold font and grey text*/
.Semibold {
	font-weight: 600;
	/*color: #6f6f6f;*/
	/*font-size: 0.925em;*/
	}	

.Italic {font-style: italic;}	


blockquote {
	margin: 1em 0;
	padding: 1em 1em 1em 3em ;
	border-left: 0.5em solid #9b191d;
	}
	blockquote p {font-style: italic;}
	blockquote p:last-of-type {padding-bottom: 0;}

	
@media all and (min-width: 60em) {	

	.IntroText { 
		font-size: 1.35em; 
		padding-bottom: 0.533em; /* 16px */
		line-height: 1.8;
		}

	.Note,
	.SmallerFont {
		font-size: 0.9375em;
		/*font-style:italic; */
		}		

}

	
/* ------------------------------------------------------------------------ Links */

a { 
	color: #b72025; 
	font-weight: bold;
	text-decoration: none;
	-webkit-transition: all 0.5s;
		transition: all 0.5s;
	}	
	a:hover {
		color: #111;
		text-decoration:none;
		}
	
	main a { word-wrap: break-word; /*Makes long URL's wrap*/ }

	a img {
		display: block;
		border: none;
		-webkit-backface-visibility: hidden;
			
		-webkit-transition: opacity 0.5s;
			transition: opacity 0.5s;
		}				
		a img:hover { opacity: .8; }		
			 
.More {
	display: inline-block;
	text-decoration:none;	
	position: relative;
	font: normal 1.25em 'Open Sans', Arial, Helvetica, sans-serif;
	color: #2c4890;
	padding-left: 1.375em;
	
	background-image: url(../../images/more.svg);
	background-repeat: no-repeat;
	background-position: left 0.22em;
	
	-webkit-transition: color 0.5s;
		transition: color 0.5s;
	}		
	.More:hover { 
		color: #111; 
		background-image: url(../../images/more-hover.svg);
		}
	
.Button {
	color: #fff;
	text-decoration:none;
	text-align:center;
	white-space: normal; /*Makes text wrap on resize */
	border:none;
	border-radius: 3px !important; 
	/*font: 700 1.25em/1.2 'Open Sans', Arial, Helvetica, sans-serif;*/
	font: 700 1em/1.2 'Open Sans', Arial, Helvetica, sans-serif;
	
	display:inline-block;	
	background: #0096ef;
	width:100%;
	margin: 0.5em 0 0.8em 0 ;
	padding: 0.5em 1em;
	cursor: pointer;
	}

	.Button.LargeButton {}
		.Button.LargeButton + .Button.LargeButton {
			background-color: #0b89d4;
			}

	.Button.SmallButton {font-size: 0.8em;}		

	.Button.SecondaryButton {
		/*background-color: #FFF;*/
		background-color: transparent;
    	color: #323642;
    	border: 2px solid #323642;
		}
		.Button.SecondaryButton:hover, .Button.SecondaryButton:focus {
			background-color: #323642;
			color: #FFF;
			}

	.Button:hover, .Button:focus {
		background: #087dc3;
		color: #FFF;
		}	
		
@media all and (min-width: 40em) {	
	
	/*.More  {font-size: 1.375em; }*/
	
	.Button { 
		/*font-size: 1.1875em;
		margin: 1em 0 0.75em 0;
		padding: 0.8em 1.5em; 
		width: auto;*/
		margin-top: 1.5em;
		width: auto;
		padding: 0.8em 1.5em;
		}

	.Button.SmallButton {}	

	.Button.LargeButton {
		/*font-size: 1.71875em;
		padding: 1.475em 1.25em;
		padding: 1.475em 1.0em;*/
		font-size: 1.1875em;
		margin: 1em 0 0.75em 0;
		padding: 0.8em 1.5em; 
		width: auto;
		}
		.Button.LargeButton.MB0 {margin-bottom: 0}	
 		.Button.LargeButton:hover, .Button.LargeButton:focus  { background-color: #273e62!important; }	

	/*.Button.SmallButton {
		margin-top: 1.5em;
		}	*/ 

	.Button + .Button {margin-left: 0.5em;}
	
}
		
	
/* ------------------------------------------------------------------------ Images */

img {
	 border: 0; 
	 max-width:100%;
	 height:auto!important;
	 margin: 0 0 1em 0; 
	 padding:0;
    -ms-interpolation-mode: bicubic;	
	}
	
figure {
	width: 100%; 
	margin: .5em auto 2em auto;
	padding: 1em;
	background: #f8f8f8;
	}
	
	figure img { 
		width: 100%;
		margin-bottom: .5em; 
		}
	
	figcaption { 
		color: #2c4890;
		text-align: center;
		padding:0 0 .5em 0;
		}
	
img.ImageFloatLeft, img.ImageFloatRight { margin: .375em 0 1em 0;	}
	
				
@media all and (min-width: 30em) {	

	img.ImageFloatLeft, img.ImageFloatRight { max-width:65%; }	
	
}

@media all and (min-width: 40em) {	
	
	img.ImageFloatLeft {
		float: left;
		margin: .375em 3.5% .375em 0;
		max-width:50%;
		}
		
	img.ImageFloatRight {
		float: right;
		margin: .375em 0 .375em 3.5%;
		max-width:50%;
		}
	
}

@media all and (min-width: 60em) {	
		
	img.ImageFloatLeft, img.ImageFloatRight { max-width:33%; }
	
}		
			
	
/* ------------------------------------------------------------------------ SVG's */

svg {
	width: 100%;
	height: 100%;
	}
		
a.SVG { /*this makes links work when wrapped around an svg used as an <object> */
	position: relative;
	display: inline-block; 
	}
	a.SVG:after {
		content: ""; 
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left:0;
		}
		
img[src$=".svg"] { max-width:100%; } /*when using svg as an <img>, this keeps it from doing wonky things in IE when being resized*/
			
.SVGFullWidth  { /*this makes full width inline or external <use> svg's resize properly in IE  */
	width:100%;
	height: 0;
    padding-top: 48%; /*adjust as necessary*/
    position: relative;
	}
	.SVGFullWidth svg {
		position: absolute;
		top: 0;
		left: 0;
		}
		
		
/* ------------------------------------------------------------------------ Video */

video { margin:1em 0 }


/* ------------------------------------------------------------------------ Horizontal Rules */

hr { 
	border:none;
	color: #ddd;
	background: #ddd;
	height:0.063em;
	/*margin:1.5em auto 1.5em auto;*/
	margin: 1em auto 1em auto;
	/*hack to make hr full window width*/
	/*width: 100vw;
	position: relative;
	left: 50%;
	transform: translateX(-50%);*/
	}	
	hr.ReducedMargin,
	hr.SmallHR {
		margin: 1em auto;
		/*width: auto;
	    left: 0;
	    transform: none;*/
		}
	
	hr + h2, hr + h3 { padding-top: 0; }
	hr + .InfoBox { margin-top: 2.5em; }	
	/*table + hr, .InfoBox + hr, .FlexibleIframe + hr { margin-top: 2.5em; }*/
	/*.TableWrapper + hr*/ 


@media all and (min-width: 60em) {

	hr {margin:2.5em auto 2em auto;}

}	

/* ------------------------------------------------------------------------ Flexible iFrames */

.FlexibleIframe {
	position: relative;
	margin: .5em 0 2em 0;
    padding-bottom: 56.25%;
    padding-top: 30px; 
	height: 0; 
	overflow: hidden;
	}
	.FlexibleIframe iframe,
	.FlexibleIframe object,
	.FlexibleIframe embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		}
		
.FlexibleIframe.Map { border: 2px solid #ddd; }


/* ------------------------------------------------------------------------ Layout */
	
.Wrapper,
.NarrowCol {
	max-width: 100em;
	width:90%;
	margin:0 auto;
	}	
		
@media all and (min-width: 50em) {	
		
	[class*='Col-'] { 
		margin-right: 4.5%;
		float:left; 
		}
		[class*='Col-']:last-child,
		[class*='Col-'].Last { margin-right: 0; }
				
		.Col-1-3 { width: 30.33%;; }	
			.Col-1-3:nth-child(3n) { margin-right: 0; }
			.Col-1-3:nth-child(3n+4) {clear: both;}
			
		
		.Col-2-3 { width: 65.16%; }	
					
		.Col-1-2, .Col-1-4 { width: 47.75%;}
			.Col-1-2:nth-child(2n), .Col-1-4:nth-child(2n) { margin-right: 0; }
		
		.Col-2-4 { width: 47.75%; }	
		.Col-3-4 { width: 73.87%; }

		.Col-4-5 {width: 79.1%;}
		.Col-3-5 {width: 58.2%;}
		.Col-2-5 {width: 37.3%;}
		.Col-1-5 {width: 16.4%;}		
		
		.Col-1-6 { width: 12.91%; }		
		.Col-5-6 { width: 82.58%; }	
		
		.NarrowCol { 
			width:65.5%;
			margin:0 auto;
			}	
			
}	

@media all and (min-width: 60em) {		
			
	.Col-1-4 { width: 21.62%;; }
		.Col-1-4:nth-child(2n) { margin-right: 4.5%; }
		.Col-1-4:nth-child(4n) { margin-right: 0; }
		.Col-1-4:nth-child(4n+5) {clear: both;}
		
}



/* =============================================================================================
	HEADER
============================================================================================= */

.PrintHeader { display:none; }

header {
	z-index: 20;
	position: relative;
	background-color: #b72025;
	padding-bottom: 1em
	}
	header .Wrapper { position: relative;}
		
.Logo { 
	margin: 1em auto 1em auto;
	padding: 0;
	display:block;
	width: 80px; 
	height: 31px;
	max-width: 100%;
	
	background: url(../../images/logo.svg) no-repeat;
	background-size: 100%;
	}
	.Logo a { 
		display: block;
		width: 100%;
		height: 100%;
		}

		
@media all and (min-width: 60em) {	
	
	header {
		border-top: 10px solid #9b191d;
		padding-bottom: 0;
		min-height: 7.8125em;
		}		

	.Logo { 
		margin: 2.25em 0;
		float:left;
		width: 117px; 
		height: 43px;
		}	
		
		.Logo.ErrorPage {
			margin:1.5em auto 2.5em auto;
			float: none;
			}
}
	
		
/* ------------------------------------------------------------------------ Language Selector (see selectric styles at bottom of page for select styling) */

.LanguageSelector {
	margin-bottom: 1em
	}
	.LanguageSelector select,
	.LanguageSelector .selectric {border: none;}	


@media all and (min-width: 60em) {	

	.LanguageSelector {
		float: right;
		width: 11.1875em;
		margin: 2.4em 0 0 0;
		}
}


/* ------------------------------------------------------------------------ Breadcrumbs http://codepen.io/bradfrost/full/dKulf */
	
/*.BreadCrumbs .Wrapper {
	overflow:hidden;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	}*/

.BreadCrumbs {
	/*animation: fadein 2s forwards;*/
}	

.BreadCrumbs ul {
	float:left;
	padding: .5em 0; 
	font-size: 0.938em;
	margin:0;
	display: block;
	}	
	.BreadCrumbs ul li {
		float: left;
		position: relative;
		overflow: hidden;
		margin: 0 1em 0 0 ;
		padding:  0 0 0 1.30em;
		display: none; 
		background-position: left 0.55em;	
		color: #FFF;	
		font-size: 0.9375em;
		}
		.BreadCrumbs ul li:first-child { padding-left: 0; }
			.BreadCrumbs ul li.First { padding-left: 0; } /*IE8*/

		.BreadCrumbs ul li:last-child, .BreadCrumbs ul li:first-child  {display: inline-block;}
			.BreadCrumbs ul li.Last, .BreadCrumbs ul li.First  {display: inline-block;} /*IE8*/
	
	.BreadCrumbs ul li a {
		color: #0096ef;
		text-decoration:none;
		font-weight: normal;
		display: inline-block;
		position: relative;
		overflow: hidden;
		}	
		.BreadCrumbs ul li a:hover { color: #FFF; }
	
			.BreadCrumbs ul li:first-child { background-image: none; }
				.BreadCrumbs ul li.First { background-image: none; } /*IE8*/

		.BreadCrumbs a span {
			color: #FFF;
		}		
				
@media all and (max-width:60em) and (min-width:0em) {
	
	.BreadCrumbs ul li:last-child { 
		background-image: url(../../images/arrow-left-white.svg);
		background-size: 6px auto;
		}
	
}
	
@media all and (min-width: 60em) {
		
	.BreadCrumbs ul li { display: inline-block; }		
		
}


/* ------------------------------------------------------------------------ MainNav (SmartMenus) */

/* ------------------------------------------------- Mobile Core CSS (don't touch!) */

.sm{position:relative;z-index:9999;}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:not-allowed;}
.sm:after{content:"\00a0";display:block;height:0;font:0px/0 serif;clear:both;visibility:hidden;overflow:hidden;}
.sm,.sm *,.sm *:before,.sm *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}


/* ------------------------------------------------- Mobile Styling (adapted from Simple Theme) */
 
.sm-simple { background: #F8F8F8; }

.sm-simple a {
	padding: 1em;	
	padding-right: 3.625em; /* make room for the toggle button (sub indicator) */
	color: #000;
	font-weight: normal;
	line-height: 1.2;
	text-decoration: none;
	outline: 0;
	}
	
	.sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active, .sm-simple a.highlighted {
		background: #9b191d;
    	color: #FFF;
		}
	
	.sm-simple a.current { background: #9b191d; }
		
	.sm-simple a.disabled { 
		background: #666;
		color: #cccccc;
		}
		
		
.sm-simple a span.sub-arrow {
	position: absolute;
	top: 50%;
	margin-top: -7px;
	left: auto;
	right: 10px;
	width: 15px;
	height: 15px;
	overflow: hidden;
	font: bold 14px/34px monospace !important;
	text-align: center;
	text-shadow: none;
	background: url(../../images/arrow-down-red.svg) no-repeat center;
	text-indent: -9999px;
	}	

	.sm-simple a.highlighted span.sub-arrow:before {
		display: block;
		content: '-';
		text-align: center;
		}
		
	
.sm-simple li { 
	border-top: 1px solid rgba(181, 181, 181, 0.2);
	background-image: none;
	}

	.sm-simple > li:first-child { border-top: 0; }
	

.sm-simple ul { background: rgba(0, 0, 0, 0.1); }

	.sm-simple ul a { font-size: .875em; }
	
/*.sm-simple .mega-menu li {
	font-size: .875em;
	color: #fff; 
	padding: 1em ;
	min-width: 20em;
	}*/
	
	
@media all and (max-width:60em) and (min-width:0em) { /*This adds a left indent on each level*/
	
	.sm-simple ul a { border-left: 8px solid transparent; }	
		.sm-simple ul ul a { border-left: 16px solid transparent; }		
			.sm-simple ul ul ul a { border-left: 24px solid transparent; }
				.sm-simple ul ul ul ul a { border-left: 32px solid transparent; }
					.sm-simple ul ul ul ul ul a { border-left: 40px solid transparent; }
		
}
	

@media all and (min-width: 60em) {
	
	/* ------------------------------------------------- Desktop Core CSS (don't touch!) */
	
	.sm-simple ul { position: absolute; width: 12em;}
	.sm-simple li { float: left; }
	.sm-simple.sm-rtl li { float: right; }
	.sm-simple ul li, .sm-simple.sm-rtl ul li, .sm-simple.sm-vertical li { float: none; }
	.sm-simple a { white-space: nowrap; }
	.sm-simple ul a, .sm-simple.sm-vertical a { white-space: normal; }
	.sm-simple .sm-nowrap > li > a, .sm-simple .sm-nowrap > li > :not(ul) a { white-space: nowrap; }
	
	
	/* ------------------------------------------------- Desktop Styling (adapted from Simple Theme) */
	 
	.MainNav { 
		/*background: #2c4890; */
		float: right;
		margin: 2em 2.25em 0 0;
		}

	.sm-simple {background-color: transparent;}	
	
	.sm-simple a {
		padding: 1em;
		color: #fff;
		color: #000;
		transition: background-color 0.5s;
		-webkit-transition: background-color 0.5s;
		}
		
		.sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active, .sm-simple a.highlighted {
			background: #9b191d;
			color: #FFF;
			}
	
	.sm-simple a.has-submenu { padding-right: 32px; }
	
		.sm-simple a span.sub-arrow {
			margin-top: -6px;
			/*right: 20px;*/
			right: 15px;
			/*width: 8px;
			height: 16px;
			font: 14px/16px monospace !important;*/
			/*background: transparent;*/
			}
		
			.sm-simple a.highlighted span.sub-arrow:before { display: none; }
			
			/*spacing for the arrow - first level*/
			.sm-simple > li > a.has-submenu { padding-right: 2.3em; } /*top level - sub-arrow*/
	
			.sm-simple > li > a span.sub-arrow { /*display: none;*/ } /*top level - sub-arrow*/


	.sm-simple li {}

		/*first level*/
		.sm-simple > li {
			margin-right: 1.75em;
			border-top: none;
			}
		.sm-simple > li > a {
			font-size: 1.1875em;
			font-weight: 700;
			text-rendering: optimizeLegibility;
			padding: 0.75em;
			color: #FFF;
			}		
	

	.sm-simple ul { 
		background: #F8F8F8;
		/*border-left: 1px solid #cccccc;
		border-right: 1px solid #cccccc;
		border-bottom: 1px solid #cccccc;*/
		box-shadow: 0 1px 1px rgba(0,0,0,0.15);
		}
	
		.sm-simple ul a.has-submenu { padding-left: 1.75em; }
		
		.sm-simple ul a span.sub-arrow {
			right: auto;
			margin-left: -12px;
			}

		.sm-simple ul a {
			font-size: 1em;
			min-width: 187px; /*make same width as parent*/
			}	
			
	
	/*.sm-simple span.scroll-up,
	.sm-simple span.scroll-down {
		position: absolute;
		display: none;
		visibility: hidden;
		overflow: hidden;
		background: #111;
		height: 2em;
		}
	
		.sm-simple span.scroll-up-arrow, .sm-simple span.scroll-down-arrow {
			position: absolute;
			top: .25em;
			left: 50%;
			margin-left: -8px;
			width: 0;
			height: 0;
			overflow: hidden;
			border-width: 8px;
			border-style: dashed dashed solid dashed;
			border-color: transparent transparent #fff transparent;
			}
			
		.sm-simple span.scroll-down-arrow {
			top: .875em;
			border-style: solid dashed dashed dashed;
			border-color: #fff transparent transparent transparent;
			}
*/
	
}


/* ------------------------------------------------- Mobile Menu/Hamburger Button */

.MainNavButton {
	padding:.75em 1em;
	background: #24292f;
	color: #fff;
	}

.main-menu-btn {
	font: 1.25em/1.4 'Open Sans', Arial, Helvetica, sans-serif;	
	margin:0;
	position: relative;
	/*display: inline-block;*/
	width: 100%;
	height: 28px;
	text-indent: 2em;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	}
	/* hamburger icon */
	.main-menu-btn-icon, .main-menu-btn-icon:before, .main-menu-btn-icon:after {
		position: absolute;
		top: 50%;
		left: 2px;
		height: 2px;
		width: 24px;
		background: #bbb;
		-webkit-transition: all 0.25s;
		transition: all 0.25s;
		}
		
		.main-menu-btn-icon:before {
			content: '';
			top: -7px;
			left: 0;
			}
		
		.main-menu-btn-icon:after {
			content: '';
			top: 7px;
			left: 0;
			}
		
		/* x icon */
		#main-menu-state:checked ~ .MainNavButton .main-menu-btn .main-menu-btn-icon {
			height: 0;
			background: transparent;
			}
			
		#main-menu-state:checked ~ .MainNavButton .main-menu-btn .main-menu-btn-icon:before {
			top: 0;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
			}
			
		#main-menu-state:checked ~ .MainNavButton .main-menu-btn .main-menu-btn-icon:after {
			top: 0;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
			}
			
		/* hide menu state checkbox offscreen (so it stays visible to screen readers) */
		#main-menu-state {
			position: absolute;
			top: -99999px;
			}
			
		/* hide the menu in mobile view */
		#main-menu-state:not(:checked) ~ #main-menu { display: none; }
		
		#main-menu-state:checked ~ #main-menu { display: block; }
		

@media all and (min-width: 60em) {

	.MainNavButton { display: none; }
	
	/* hide the button in desktop view */
	.main-menu-btn {
		position: absolute;
		top: -99999px;
		}
		
	/* always show the menu in desktop view */
	#main-menu-state:not(:checked) ~ #main-menu {
		display: block;
		}
	
}


/* ------------------------------------------------------------------------ SubNav (SmartMenus) */

/* ------------------------------------------------- Mobile Styling (adapted from Simple Theme) */
 
.SubNav {
	background-color: #2c4365;
	border-top: 1px solid #5a5a5a;
	}
	.SubNav .Wrapper {width: 100%;}

.sm-subnav {  }

.sm-subnav a {
	padding: 1em;	
	color: #fff;
	font-weight: normal;
	line-height: 1.2;
	text-decoration: none;
	outline: 0;
	}
	
	.sm-subnav a:hover, .sm-subnav a:focus, .sm-subnav a:active, .sm-subnav a.highlighted {
		background: #0096ef;
    	color: #FFF;
		}
	
	.sm-subnav a.current,
	.sm-subnav li.MoreOptions a.current { background: #0096ef; }
		
	.sm-subnav a.disabled { 
		background: #666;
		color: #cccccc;
		}
		
.sm-subnav li { 
	border-top: 1px solid rgba(181, 181, 181, 0.2);
	background-image: none;
	}

	.sm-subnav > li:first-child { border-top: 0; }

	/*right links in subnav*/
	.sm-subnav li.MoreOptions a {
		background-color: #415578;
		}
		.sm-subnav li.MoreOptions a:hover, .sm-subnav li.MoreOptions a:focus, .sm-subnav li.MoreOptions a:active, .sm-subnav a.highlighted {
			background: #0096ef;
			}


@media all and (min-width: 60em) {
	
	/* ------------------------------------------------- Desktop Core CSS (don't touch!) */
	
	.sm-subnav ul { position: absolute; width: 12em;}
	.sm-subnav li { float: left; }
	.sm-subnav.sm-rtl li { float: right; }
	.sm-subnav ul li, .sm-subnav.sm-rtl ul li, .sm-subnav.sm-vertical li { float: none; }
	.sm-subnav a { white-space: nowrap; }
	.sm-subnav ul a, .sm-subnav.sm-vertical a { white-space: normal; }
	.sm-subnav .sm-nowrap > li > a, .sm-subnav .sm-nowrap > li > :not(ul) a { white-space: nowrap; }
	
	
	/* ------------------------------------------------- Desktop Styling (adapted from Simple Theme) */
	 
	.SubNav {border-top: none;}
		.SubNav .Wrapper {width: 90%;}

	.sm-subnav {background-color: transparent;}	
	
	.sm-subnav a {
		padding: 1em;
		color: #fff;
		color: #000;
		transition: background-color 0.5s;
		-webkit-transition: background-color 0.5s;
		}
		
		.sm-subnav a:hover, .sm-subnav a:focus, .sm-subnav a:active, .sm-subnav a.highlighted {
			background: #0096ef;
			color: #FFF;
			}

	.sm-subnav li {}

		/*first level*/
		.sm-subnav > li {
			/*margin-right: 1.1em;*/
			border-top: none;
			}
		.sm-subnav > li > a {
			font-size: 0.8em;
			font-weight: 600;
			text-rendering: optimizeLegibility;
			padding: 1.25em 0.65em;
			color: #FFF;
			border-right: 2px solid #1b2330;
			}
			.sm-subnav > li > a.Last,
			.sm-subnav > li.Pedigree > a {border-right: none;}	


		.sm-subnav li.MoreOptions {float: right;}	
			.sm-subnav li.MoreOptions a {
				
				}

	/*current active blue link*/
	.sm-subnav a.current {
		/*border-right: none;
	    margin-left: -2px;
	    margin-right: -2px;*/
		}		
		/*the down arrrow*/
		.sm-subnav a.current:after {
			content: "";
			position: absolute;
			z-index: -1;
			top: 100%;
			left: 0;
			right: 0;
			margin: 0 auto;
			width: 0; 
			height: 0; 
			border-left: 11px solid transparent;
			border-right: 11px solid transparent;
			border-top: 11px solid #0096ef;
			animation: slidearrow 1s ease;
			-webkit-animation: slidearrow 1s ease;
			}		
	
	
}

@media all and (min-width: 75em) {

	.sm-subnav > li > a {
		font-size: 0.85em;
		padding: 1.25em 0.75em;
		}

}

@media all and (min-width: 94.25em) {

	.sm-subnav > li > a {
		font-size: 1.0em;
		padding: 1.25em 1em;
		}

}


@-webkit-keyframes slidearrow {
	from {
		-webkit-transform: translateY(-1em);
		        transform: translateY(-1em);
	}
	to {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
}
@keyframes slidearrow {
	from {
		-webkit-transform: translateY(-1em);
		        transform: translateY(-1em);
	}
	to {
		-webkit-transform: translateY(0);
		        transform: translateY(0);
	}
}

/* ------------------------------------------------- SubNav - Mobile Menu/Hamburger Button */

.SubNavButton {
	padding:.75em 1em;
	background: #24292f;
	color: #fff;
	}

.sub-menu-btn {
	font: 1.25em/1.4 'Open Sans', Arial, Helvetica, sans-serif;	
	margin:0;
	position: relative;
	/*display: inline-block;*/
	width: 100%;
	height: 28px;
	text-indent: 2em;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	}
	/* hamburger icon */
	.sub-menu-btn-icon, .sub-menu-btn-icon:before, .sub-menu-btn-icon:after {
		position: absolute;
		top: 50%;
		left: 2px;
		height: 2px;
		width: 24px;
		background: #bbb;
		-webkit-transition: all 0.25s;
		transition: all 0.25s;
		}
		
		.sub-menu-btn-icon:before {
			display: none;
			/*content: '';
			top: -7px;
			left: 0;*/
			}
		
		.sub-menu-btn-icon:after {
			content: '';
			top: -11px;
			left: 11px;
			height: 24px;
    		width: 2px;
			}
		
		/* x icon */
		#sub-menu-state:checked ~ .SubNavButton .sub-menu-btn .sub-menu-btn-icon {
			/*height: 0;
			background: transparent;*/
			}
			
		#sub-menu-state:checked ~ .SubNavButton .sub-menu-btn .sub-menu-btn-icon:before {
			/*top: 0;*/
			left: 0;
			height: 0;
			-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
			}
			
		#sub-menu-state:checked ~ .SubNavButton .sub-menu-btn .sub-menu-btn-icon:after {
			display: none;
			/*top: 0;
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);*/
			}
			
		/* hide menu state checkbox offscreen (so it stays visible to screen readers) */
		#sub-menu-state {
			position: absolute;
			top: -99999px;
			}
			
		/* hide the menu in mobile view */
		#sub-menu-state:not(:checked) ~ #sub-menu { display: none; }
		
		#sub-menu-state:checked ~ #sub-menu { display: block; }
		

@media all and (min-width: 60em) {

	.SubNavButton { display: none; }
	
	/* hide the button in desktop view */
	.sub-menu-btn {
		position: absolute;
		top: -99999px;
		}
		
	/* always show the menu in desktop view */
	#sub-menu-state:not(:checked) ~ #sub-menu {
		display: block;
		}
	
}



/* =============================================================================================
	MAIN CONTENT AREA
============================================================================================= */

/* ------------------------------------------------------------------------ Layout */

main {overflow: hidden;}
	main:focus { outline: none; }
	
	/*aside { margin-top:1em; }*/	

	article {padding: 1em 0;}
		article p {
			font-size: 0.9em;
			}
		
@media all and (min-width: 60em) {			
			
	article {
		padding: 3.4em 0 7em 0;
		animation: fadein 1s forwards;
		-webkit-animation: fadein 1s forwards;
		min-height: 40em;
		}

		article p {font-size: 1.0625em;}
		
	/*aside {
		float:right;
		width:31.5%;
		padding-top:0;
		margin-top:0;
		border-top:none;
		}*/
					
}


/* ------------------------------------------------------------------------ Sections */

section { padding: 2em 0; }

	section.Grey {background-color: #f3f3f3; }


@media all and (min-width: 60em) {	

	section { padding: 5.25em 0; }

}


/* ------------------------------------------------------------------------ Heading Block */

.HeadingBlock {
	background-color: #1b2330;
	padding: 1em 0;
	}

	.HeadingBlock .Wrapper {position: relative;}

	.HeadingBlock h1 {
		padding-bottom: 0;
		}

	/*print button in headingblock*/
	.HeadingBlock .PrintButton {
		display: none;
		}

@media all and (min-width: 60em) {	

	.HeadingBlock {
		padding: 2.0em 0 2.1em 0;
		}

		.HeadingBlock h1 {
			position: relative;
			display: inline-block;
			margin-top: 0.45em;
			}
			.HeadingBlock h1.isMale:after {
				content: "";
				position: absolute;
				right: -2em;
				top: 0.125em;
				width: 72px;
				height: 48px;
				background: url(../../images/bull-icon-white.svg) no-repeat;
				background-size: 100% auto;
				}
			.HeadingBlock h1.isFemale:after {
				content: "";
				position: absolute;
				right: -2em;
				top: 0.125em;
				width: 72px;
				height: 48px;
				background: url(../../images/cow-icon-white.svg) no-repeat;
				background-size: 100% auto;
				}	

	/*print button in headingblock*/
	.HeadingBlock .PrintButton {
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		background: #FFF url(../../images/print-icon.svg) no-repeat center;
		background-size: 1.5em auto;
		border-radius: 50%;
		width: 2.5em;
		height: 2.5em;
		text-indent: -9999px;
		}
		.PrintButton:hover {opacity: 0.6}			
}


			
/* ------------------------------------------------------------------------ Callouts */	

.CalloutGroup { margin: .5em 0 1em 0; }

	.Callout a { 
		display: block;
		width: 100%;
		padding-bottom:100%;
		height:0;
		margin: 0 auto 1.5em auto;
		color: #fff;
		text-align:center;
		position: relative;
		background: #2c4890;
		}
		.Callout a:hover { background: #111; }

    .Callout .CalloutText { 
		font: 1.75em/1.2 'Open Sans', Arial, Helvetica, sans-serif;	
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		}
		
		
/* ------------------------------------------------------------------------ InfoBox Modules */

/* ------------------------------------------------- Base Styles */

.InfoBox {	
	background: #f3f3f3;
	margin: 0.5em 0 0.5em 0;
	}	
	.InfoBox.Padded, .InfoBox .Padded { 
		/*padding: 1.25em 1.5em 1.25em 1.5em;*/
		padding: 1em;
		} 
	
	.InfoBox > h2:first-child, .InfoBox > h3:first-child { padding-top: 0; }
		.InfoBox > h2.First, .InfoBox > h3.First { padding-top: 0; } /*IE8*/

	.InfoBox .selectric {border: none;}	

	h2 + .InfoBox {margin-top: 0;}
		
	
@media all and (min-width: 60em) {
	
	.InfoBox {
		margin:.5em 0 1.5em 0;
		}	

	.InfoBox.Padded, .InfoBox .Padded { padding: 1.25em 2em 1.25em 2em; } 

}	
	
/* ------------------------------------------------- Title Module  */	

.InfoBox h3.Header { 
	padding: 0;
	color: #fff;		
	background: #2c4890;
	}				
	.InfoBox h3.Header a {
		color: #fff; 
		background: #2c4890;
		text-decoration: none;
		font-weight: normal;
		padding:.375em .625em;
		display: block;
		}
		.InfoBox h3.Header a:hover { 
			text-decoration: none;
			background: #111; 
			}
			
		.InfoBox h3.Header.NoLink { padding:.375em .625em; } /* If the title has no link in it */
			
@media all and (min-width: 40em) {	

	.InfoBox h3.Header a, .InfoBox h3.Header.NoLink { padding:.25em .625em; }
		
}


/* ------------------------------------------------- List of Links Module */	

.InfoBox ul.LinksList { padding: 0; }
	
	.InfoBox ul.LinksList li { 
		margin:0; 
		padding: 0;
		border-bottom:1px solid #fff;
		background-image: none; 
		}
		.InfoBox ul.LinksList li:last-child { border-bottom: none; }
												
		.InfoBox ul.LinksList li a {  		
			display: block;
			width: 100%;
			padding:.875em 1.5em;
			text-decoration:none;
			color: #2c4890;
			font-weight: bold;
			
			-webkit-transition: background 0.5s;
				transition: background 0.5s;
			}
			.InfoBox ul.LinksList li a:hover { 
				background-color: #f8f8f8;
				text-decoration: underline; 
				}
				.Grey .InfoBox ul.LinksList li a:hover { background-color: #fff; }
				
				.InfoBox ul.LinksList li ul {
					border-top: 1px solid #fff;
					margin: 0;
					padding:0; 
					}
														
					.InfoBox ul.LinksList li li a { 
						font-weight: normal;
						padding-left: 2.5em;
						
						background: url(../../images/arrow-right-grey.svg) no-repeat 1.5em 1.25em;
						background-size: 6px;
						}
				
						.InfoBox ul.LinksList li li li a { 
							padding-left: 3.5em; 
							background-position: 2.5em 1.25em;
							}
							
							.InfoBox ul.LinksList li li li li a { 
								padding-left: 4.5em; 
								background-position: 3.5em 1.25em;
								}
								
								.InfoBox ul.LinksList li li li li li a { 
									padding-left: 5.5em;
									background-position: 4.5em 1.25em;
									}
									
															
/* ------------------------------------------------- SideNav Module - variation on LinksList module */

.SideNav, .Grey .SideNav {	
	background: #2c4890; 
	margin-top: 0;
	}	
	
	.SideNav h3.Header a { background: #111; }	
		.SideNav h3.Header a:hover { background: #2c4890; }
		
	.SideNav ul.LinksList li { border-bottom: 1px solid rgba(255, 255, 255, 0.25); }
			
		.SideNav ul.LinksList li a { color: #fff; }
		
			.SideNav ul.LinksList li a:hover, .Grey .SideNav ul.LinksList li a:hover { 
				background: #111; 
				text-decoration: underline; 
				}
				
				.SideNav ul.LinksList li ul { border-top: 1px solid rgba(255, 255, 255, 0.25); }
					

		.SideNav ul.LinksList li li { background: rgba(0, 0, 0, 0.1); }
		 
			.SideNav ul.LinksList li li a { background-image: none; }
									
				.SideNav ul.LinksList li li a, .SideNav ul.LinksList li li li a, .SideNav ul.LinksList li li li li a, .SideNav ul.LinksList li li li li li a { padding-left: 1.5em; }
																				

/* ------------------------------------------------- Accordions Module */

.InfoBox .Accordion { 
		margin: 0;
		padding:0;
		overflow:hidden;	
		list-style: none; 
		}		
		.InfoBox .Accordion dt { 
			margin:0; 
			padding: 0;
			border-bottom:1px solid #fff;
			position:relative;			
			}
				
			.InfoBox .Accordion dt a {  		
				display: block;
				width: 100%;
				padding: .875em 1.5em .875em 3.125em;
				font-weight: normal;
				text-decoration:none;
				color: #2c4890;
				
				background-image: url(../../images/arrow-right-grey.svg);
				background-repeat: no-repeat;
				background-position: 1.5em 1.125em;
				
				-webkit-transition: background-color 0.5s;
					transition: background-color 0.5s;
				}
				.InfoBox .Accordion dt a:hover { 
					background-color: #f8f8f8; 
					text-decoration:underline; 
					}
					.Grey .InfoBox .Accordion dt a:hover { background-color: #fff; }
					
					.InfoBox .Accordion dt.Active a { 
						color: #fff;
						font-weight:bold;
						
						background-color: #2c4890;
						background-image: url(../../images/arrow-down-white.svg);
						background-position: 1.5em 1.25em;
						}
						.Grey .InfoBox .Accordion dt.Active a:hover { background-color: #2c4890; }
						.InfoBox .Accordion dt.Active a:focus { outline: none; } 
					
	.InfoBox .Accordion dd {		
		margin: 0 ;
		padding:  1em 1.5em .75em 1.5em ;
		display: block;
		border-bottom:1px solid #fff;
		background: #f8f8f8;
		}
		.Grey .InfoBox .Accordion dd { background-color: #fff; }
			


/* ------------------------------------------------------------------------ Homepage Banner */

.Banner {
	position: relative;
	/*background: #FFF url(../../images/main-image.jpg) no-repeat center;
	background-size: cover;*/
	overflow: hidden;
	}
	/*banner dna image*/
	.Banner:before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
		background: #FFF url(../../images/main-image.jpg) no-repeat center;
		background-size: cover;
		animation: fadein 2s forwards, dnaanimation 30s ease-in-out 1s forwards;
		-webkit-animation: fadein 2s forwards, dnaanimation 30s ease-in-out 1s forwards;
		/*perspective: 800px;*/
		}

	.BannerContent {
		animation: fadein 2s forwards;
		-webkit-animation: fadein 2s forwards;
		padding: 1.5em 5%;
		}

		/*the first 2 lines of text*/
		.BannerContent p {}
			.BannerContent p.BannerSubHeading {
				font-family: 'Clear Sans Medium', Arial, Helvetica, sans-serif; 
				line-height: 1;
				color: #0b89d4;
				font-size: 1.5em;
				}	
			.BannerContent p.BannerHeading {
				font-family: 'Clear Sans Regular', Arial, Helvetica, sans-serif; 
				line-height:1.1;
				color: #273e62;
				font-size: 3.85em;
				letter-spacing: -0.06em;
				word-spacing: 0.04em;
				}

		.BannerButtons {
			margin-top: 1em;
			}	

			.BannerButtons .Button {
				padding: 1em 1em;
				box-shadow: 0 3px 0 rgba(47,54,71,0.55);
				transition: all 0.25s ease-in-out;
				}	
			
				.BannerButtons .Button:hover,
				.BannerButtons .Button:active {
					box-shadow: 0 0 0 rgba(47,54,71,0.55);
					transform: translateY(3px);
					-webkit-transform: translateY(3px);
					}

@media all and (min-width: 60em) {

	.Banner {
		height: 781px;
		height: calc(95vh - 125px);
		}

		/*all content centered in banner*/
		.BannerContent {
			width: 100%;
			padding: 0;
			position: absolute;
			/*left: 50%;
			top: 50%;
			transform: translate3d(-50%,-50%,0) ;
			-webkit-transform: translate3d(-50%,-50%.0);*/
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			margin: auto;
			z-index: 2;
			/*height: 438px;*/
			height: 27.375em;
			}

			.BannerContent p {}
				.BannerContent p.BannerSubHeading {font-size: 2.5em;}
				.BannerContent p.BannerHeading {font-size: 8.25em;}

		.BannerButtons {margin-top: 7.7em;}

		.BannerButtons .Button {
			position: relative;
			width: 303px;	
			width: 18.9375rem;
			margin-top: 0;	
			margin-bottom: 0;

			font-size: 1.71875em;
			/*padding: 1.475em 1.25em;*/
			padding: 1.475em 1.0em;
			}	

			/*individual search button*/
			.BannerButtons .Button:nth-child(1):before {
				content: "";
				position: absolute;
				left: 0;
				top: -1.65em;
				right: 0;
				margin: 0 auto;
				width: 115px;
				height: 79px;
				background: url(../../images/bull-icon.svg) no-repeat;
				}

			/*group search button*/
			.BannerButtons .Button:nth-child(2):before {
				content: "";
				position: absolute;
				left: 1em;
				top: -1.65em;
				/*right: 0;
				margin: 0 auto;*/
				width: 215px;
				height: 79px;
				background: url(../../images/group-bulls.svg) no-repeat;
				}	
			
			.BannerButtons .Button + .Button {
				margin-left: 2.75em;
				}


}


@-webkit-keyframes dnaanimation {
	0%, 100% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(0);
		        transform: perspective(1900px) scale(1,1) rotateX(0);
	}
	25% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(20deg);
		        transform: perspective(1900px) scale(1,1) rotateX(20deg);
	}

	75% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(-20deg);
		        transform: perspective(1900px) scale(1,1) rotateX(-20deg);
		}
}

@keyframes dnaanimation {
	0%, 100% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(0);
		        transform: perspective(1900px) scale(1,1) rotateX(0);
	}
	25% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(20deg);
		        transform: perspective(1900px) scale(1,1) rotateX(20deg);
	}

	75% {
		-webkit-transform: perspective(1900px) scale(1,1) rotateX(-20deg);
		        transform: perspective(1900px) scale(1,1) rotateX(-20deg);
		}
}

@-webkit-keyframes fadein {
	from {
		visibility: hidden;
		opacity: 0;
	}
	to {
		visibility: visible;
		opacity: 1;
	}
}

@keyframes fadein {
	from {
		visibility: hidden;
		opacity: 0;
	}
	to {
		visibility: visible;
		opacity: 1;
	}
}

/* ------------------------------------------------------------------------ Tooltips (see tooltipster css)*/

/*question mark used for tooltip*/
.QuestionMark {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	/*top: 0.05em;*/
	top: 0;
	/*width: 1.15em;*/
	width: 1.293125rem;
	/*height: 1.15em;*/
	height: 1.293125rem;
	background-color: #b72025;
	color: #FFF;
	border-radius: 50%;
	text-align: center;
	/*line-height: 1.15;*/
	line-height: 1.0;
	/*font-size: 0.9em;*/
	font-size: 1.15rem;
	margin-left: 0.25em;
	cursor: pointer;
	}
	h4 .QuestionMark {top: -2px;}


/* ------------------------------------------------------------------------ Query - Summary Page */

.CowDetails {}
	.CowDetails .Stat { padding-right: 0.75em; }

		.CowDetails .Stat:empty {display:none}

	.CowDetails .RegistrationLabel {
	    width: 3em;
    	display: inline-block;
    	}

    .CowDetails .Shortname {color: #395277;}	

    /*prevents column from dissapearing*/
    .ColumnSpacer {
    	width: 1px;
    	min-height: 1px;
    	}

	.WarningIcon {
		width: 25px;
		width: 1.5625rem;
		position: relative;
		top:0.2em;
		margin-left: 0.25em;
		}	


/* ------------------------------------------------------------------------ Table-chart Summary Page */

/*for tables that have bar charts in them */
.SummaryTable {
	min-width: 800px;
	margin: 0 0 1em 0;
	}

	.SummaryTable td {vertical-align: middle;}

	.SummaryTable th {background-color: #FFF;}
	
	/* set barchartheading on td*/
	.BarChartHeading {
		width: 30%; /*sets the width of the barchart column*/
		border-bottom: 1px solid #323642;
		}
		.HeadingNumber {
			float:left;
			width: 16.66666666666667%;
			font-size: 0.75em;
			font-weight: 600;
			}

			.HeadingNumber:nth-child(4) {text-indent: -3px;}

		.HeadingNumberCenter {width: 0;}	

	.BarChartLines {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		border-bottom: 1px solid #323642;
		}
		.Line {
			position: relative;
			float: left;
			width: 16.66666666666667%;
			height: 100%;
			border-left: 1px solid #323642;
			}
			.Line:last-child {
				border-right: 1px solid #323642;
				}
			
	
	.BarChartRow {
		min-height: 36px;
		height: 100%;
		position: relative;
		}
		.BarChartLeft,
		.BarChartRight {
			position: relative;
			float: left;
			width: 50%;
			min-height: 36px;
			height: 100%;
			}
			.BarChartLeft {}
			.BarChartRight {}
			/*the red bar*/
			.Bar {
				position: absolute;
				top: 0;
				background-color: #b72025;
				min-height: 36px;
				height: 100%;
				/*visibility: hidden;*/
				visibility: visible; /*make visible on mobile to prevent glitches*/
				width: 0;
				overflow: hidden;
				}
				.BarChartLeft .Bar {
					right: 0;
					}	
				.BarChartRight .Bar {
					left: 0;
					}

				/*image needed for print styles*/
				.Bar img {
					display: none;
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 100%!important;
					margin: 0;
					}

				/*odd coloured bars*/
				/*tr:nth-child(odd) .Bar {background-color: #9b191d;}	*/

				/*animate the bars when in view*/
				.animateIn .Bar {
					animation: animatewidth 1s cubic-bezier(0.35, 0.95, 0.67, 0.99) forwards;
					-webkit-animation: animatewidth 1s cubic-bezier(0.35, 0.95, 0.67, 0.99) forwards;
					}	

@keyframes animatewidth {
	0% {
		width: 0;
	}
	100% {
		visibility: visible;
	}
}	
@-webkit-keyframes animatewidth {
	0% {
		width: 0;
	}
	100% {
		visibility: visible;
	}
}					


@media all and (min-width: 50em) {

	.HeadingNumber {
		font-size: 0.875em;
		line-height: 2.5;
		}

}

@media all and (min-width: 60em) {

	.DescriptionCol { width: 240px;}

	.RatingCol { width: 82px;}

	.RankCol { width: 65px; }

	.DescriptorLeftCol { width: 140px; }

	.BarChartHeading {width: 50%;} /*width the bar chart takes up in table*/

	.Bar {visibility: hidden;}

}

/* ------------------------------------------------------------------------ Genomics Page */

.GenomicsTable {}
	/*first column in genomics table*/
	.GenomicsTable th:first-of-type,
	.GenomicsTable tbody tr td:first-of-type {width: 25%;}

	/*second column in genomics table*/
	.GenomicsTable th:nth-child(2),
	.GenomicsTable tbody tr td:nth-child(2) {width: 5%;}


/* ------------------------------------------------------------------------ Calving Page */

@media all and (min-width: 84em) {

	.CalvingTable {}
		/*first column in table*/
		.CalvingTable th:first-of-type,
		.CalvingTable tbody tr td:first-of-type {width: 29%;}

}	

/* ------------------------------------------------------------------------ Pedigree Tree */	

.PedigreeTree {
	min-width: 43em;
	}

	.PedigreeTree .Col-1-3 {
		float: left;
		width: 30.33%;
		margin-right: 4.5%;
		}
		.PedigreeTree .Col-1-3.Last {margin-right: 0}

	.TreeInfo {font-size: 0.9em;}

	.TreeInfo.ShowLine {
		position: relative;
		}
		.TreeInfo.ShowLine:after {
			content: "";
			position: absolute;
			right: 0;
			top: 50%;
			margin-top: -1px;
			width: 15%;
			height: 1px;
			background-color: #9b191d;
			}
			.ShowLine.Line2:after {top: 35%;}
			.ShowLine.Line3:after {top: 65%;}

	.TreeInfo p:nth-child(2) {padding-bottom: 0}

@media all and (min-width: 60em) {

	.TreeInfo {font-size: 1em;}
}

@media all and (max-width:78.125em) and (min-width:0) {

	/*piggybacks tablewrapper*/
	.TableWrapper.PedigreeWrapper {
	    max-height: 520px;
		}	

}		


/* ------------------------------------------------------------------------ Tables */

table {
    border-collapse: collapse;
    border-spacing: 0;
	border:none; 
	width:100%;	
	/*margin: 0.5em 0 1em 0;*/
	margin: 1em 0 1em 0;
	overflow:auto;
	font-size: 0.9em; /*makes everything in table smamler - cause of ems*/
	}	
	/*table[style] {width:100% !important; }	*/
	
	tr {
		background: #f3f3f3;
		border: none;
		transition: background-color 0.25s ease-in-out;
		/*border-bottom:2px solid #eee;*/
		}
		
		tr:nth-child(odd) { background: #FFF; }
			tr.Odd,
			td.Odd,
			tr.AllOdd { background: #FFF; } /*IE8*/

			td.Even,
			tr.AllEven {background: #f3f3f3;}

			/*tr:hover,*/

			/*hovers are now done via javascript because of wonky colspans*/
			.hover,
			tr.AllOdd.hover,
			tr.AllEven.hover,
			tr:nth-child(odd).hover {
				/*background-color: rgba(0, 150, 239, 0.15);*/
				background-color: #d9effd}

	
	th, td {
		text-align: center;
		/*vertical-align: top;*/
		vertical-align: middle;
		font-size: 0.875em;	
		/*padding:1.25em 1.5em ;*/
		padding: 0.5em 0.625em;
		border-right: 1px solid #FFF;
		/*border-right: 2px solid #FFF;*/
		}	
			
		th {
			/*background: #b72025;*/
			
			background: #ca4c50;
			color: #fff;
			font-weight:bold;
			/*padding: 0.8125em 1.125em;*/
			padding: 0.7em 1.125em;
			vertical-align: middle;
			}
			/*for white th/td*/
			th.Transparent,
			td.Transparent,
			.TableSubheading td.Transparent,
			.TableSubheadingAlt td.Transparent,
			.TableSubheading th.Transparent,
			.TableSubheadingAlt th.Transparent {
				/*background-color: transparent;*/
				background-color: #FFF;
				color: #111;
				font-weight: 500
				}

	/*dark red + dark blue table headings - put style on tr*/
	.TableSubheading td,
	.TableSubheadingAlt td,
	.TableSubheading th,
	.TableSubheadingAlt th  {
		/*background: #2c4365;*/
		/*background: #cc3f44;*/
		background: #535d6b;
	    color: #fff;
	    font-weight: 600;
	    padding: 0.5em 0.625em;
		}
		.TableSubheadingAlt td,
		.TableSubheadingAlt th {
			/*background-color: #9b191d;*/
			/*background: #b72025;*/
			/*background: #657488;*/
			background: #4c84bd;
			}

	.BorderBottom {
		border-bottom: 2px solid #111;
		}
		.GrayBorderBottom {border-bottom: 1px solid #ddd;}
		/*tr.BorderBottom td { border-bottom: 2px solid #111; }*/

	.NoBorderBottom {border-bottom: 0}

	/*for th with basic white styling of tds*/
	tr.NoTHStyling th {
		background-color: #FFF;
		padding: 0.5em 0.625em;
		color: #111;
		font-weight: 600
		}		

	
	.thWhite th {background: #FFF}		

@media all and (min-width: 60em) {

	table {
		margin: 2em 0 1em 0;
		font-size: 1em;
		}
}

@media all and (max-width:78.125em) and (min-width:0) {
	
	.TableWrapper {
		 position: relative; 
		/*margin: .5em 0 2em 0;*/
		margin: 1em 0 1em 0;
		max-height: 320px;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
		}
		.TableWrapper table { margin: 0; }

		/*fade on tables*/
		.TableFade {position: relative;}
			.TableFade:after {
				content: "";
				position: absolute;
				right: 0;
				top: 0;
				width: 2.5em;
				z-index: 1002;
				height: 100%;
				pointer-events: none;
				/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
				background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
				background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
				background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */

				}
		
}



/* ------------------------------------------------------------------------ Forms */
	
hr.Form { margin-top: 2.5em; }

.Error, .Error[style], .Required {
	color: #e7004c !important;
	font-size: 0.875em;
	font-weight:bold;
	}
	
label {
	display:block; 
	margin: 1.0em 0 0.25em 0;
	font-size: 0.9375em;
	}	
	input[type="radio"] + label {
		display:inline-block; 
		margin: 0 0 0.5em 0;
		/*width:85%;	*/
		width: calc(100% - 21px);
		line-height: 1.4;
		}

	
	input[type="checkbox"] + label {
		display: inline-block;
		margin-top: 0;
		/*margin-left: 0.25em;*/
		}	
		
			/*label:first-of-type + input[type="checkbox"] {margin-left: 0;}	*/
		/*.RadioTable td label {
			margin-left: .25em; 
			width: auto;
			}*/

	/*for checkboxes that are side by side, or if you neeed to wrap a label around a checkbox*/
	.CheckboxList label + input[type="checkbox"] {margin-left:1em;}	
		.CheckboxList label + input[type="checkbox"]:first-of-type {margin-left: 0;}	

		.CheckboxList label {margin-top: 0;}
			.CheckboxList label input[type="checkbox"] {}

		.CheckboxList.InlineList label {display: block;}	
		/*.CheckboxList.InlineList label + label {margin-left: 0.5em;}*/
		
			
		/*label.RadioCheck.Last {margin-bottom:0; }*/
	
input, select, textarea {
	border: 1px solid #eee;
	font-size:0.875em;
	font: normal 0.875em/1.6 'Open Sans', Arial, Helvetica, sans-serif; 
	color: #111;
	width: 100%;
	padding: .45em .75em;
	background: #fff;	
	border-radius: 0;	
	/*height: 38px;*/
		
	-webkit-transition: all 0.5s;	
		transition: all 0.5s;
	}	
								
	input[type="checkbox"], input[type="radio"], input[type="image"] {
		height: auto;
		width:auto;
		padding: 0;
		background:transparent;
		vertical-align:top;
		margin-top:.375em;
		margin-left: 0;
		}
			
	textarea { 
		height: 10em; 
		width:100%;
		display: block;
		}
		textarea.Description { height: 20em; }

	/*select elements are overwritten by selectric plugin - but these styles prevent FOUT*/	
	select {
		font-size: 1em;
		color: #b72025;
		-webkit-appearance: none; 
		appearance: none;
		background: #FFF url(../../images/arrow-down-red.svg) no-repeat 93% center;
    	background-size: 18px auto;
    	/*padding-right: 18px;*/
    	padding-right: 38px;
		}	
	select::-ms-expand {
	 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	 filter: alpha(opacity=0);
	 opacity:0;
	 }	

.datepicker {
	background: #FFF url(../../images/calendar-icon.svg) no-repeat 95% center;
	background-size: 25px auto;
	}		


.InlineElement {display: inline-block;}		

/*Switches*/
.Switcher {
	margin: 0.5em 0 0.5em 0.5em;
	width: 100%;
	}
	.Switcher input[type="radio"] {
		height: auto;
		width: auto;
		padding: 0;
		background:transparent;
		vertical-align:top;
		}

	.Switcher label {
		position: relative;
		min-width: 6em;
		display: inline-block;
		}
	.Switcher input[type="radio"] {display:none;}
	
	.Switcher input[type="radio"] + label {
		cursor: pointer;
		border: 1px solid #afafaf;
		padding: 0.15em 0.5em;
		text-align: center;
		margin: 0;
		margin-left: -0.35em;
		width: 100%;
		transition: all 0.15s ease-in-out;
		-webkit-transition: all 0.15s ease-in-out;
		}	
		.Switcher input[type="radio"]:checked + label,
		.Switcher input[type="radio"] + label:hover {
			color: #FFF;
			background: #9b191d;
			}
			.Switcher input[type="radio"] + label:hover {
				background: #323642;
				}	
		
		
@media all and (max-width:64em) and (min-width:0) {
	
	input[type="text"], input[type="submit"], textarea { -webkit-appearance: none; }
	
}

@media all and (min-width: 60em) {

	input[type="text"], select {
		height: 38px;
		}

	.InlineElement {}	

	.InlineElement + .InlineElement {margin-left: 0.5em;}

	.CheckboxList.InlineList label {display: inline-block;}	
		.CheckboxList.InlineList label + label {margin-left: 0.5em;}


	.Switcher {width: auto;}

		.Switcher input[type="radio"] + label {width: auto;}	
}


@media all and (min-width: 80em) {

	input[type="radio"] + label {
		width: auto;
		}	
		label + input[type="radio"] {margin-left: 1.5em;}

}
			

/* =============================================================================================
	FOOTER + Subfooter
============================================================================================= */

.PrintFooter { display:none; }

footer { 
	position: relative;
	background: #323642;
	padding: 2em 0 0 0;
	text-align: center;
	clear: both;
	}

	footer p {
		color: #989ba1;
		}
	
	footer a { 
		color:#fff;
		text-decoration:none; 
		}
		footer a:hover { text-decoration:underline; }

	.Social {
		margin: 0;}
		
		.Social div {display: inline-block;}
	
		.Social a {
			display: block;
			width: 2.25em;
			height: 2.25em;
			margin: 0 1.5em 0 0;
			background-repeat: no-repeat;
			background-position: center center;
			background-color: #fff;
			border-radius:50%;
			}
			.Social a:hover { opacity: 0.6 }
		
			.Twitter a { background-image: url(../../images/twitter.svg); background-size: 25px auto; }
				
			.Facebook a {
				background-image: url(../../images/facebook.svg);
				background-size: 14px auto;
				margin-right: 0;
				}

	.FooterLinks a {
		padding: 0 0.75em;
		font-size: 0.9375em;
		}
		.FooterLinks a:hover {
			color: #FFF;
			}		

	.SubFooter {
		background-color: #24292f;
		margin-top: 1.5em;
		padding: 1em;
		}		

		.RKD {
			width: 78px; 
			height: 14px;
			background-size:100%;
			/*margin-top:1em;*/
			display:inline-block;
			
			background-image: url(../../images/rkd-logo.svg);
			background-repeat: no-repeat;
			opacity: 0.5;
			}	
			.RKD a {
				display: block;
				width: 100%;
				height: 100%;
				}

		.Copyright {
			font-size: 0.84375em;
			color: rgba(255, 255, 255, 0.5);
			}		
			
			
@media all and (min-width: 50em) {
	
	footer {
		padding: 6.1em 0 0 0;
		text-align: left;
		/*min-height: 265px;*/
		}
		
		.Social {
			text-align: right;
			margin-top: -0.75em;/*nudge it up to offset footer padding*/
			}	

		.FooterLinks a:first-child {padding-left: 0;}


	.SubFooter {
		padding: 1.35em 0 1.35em 0;
		margin-top: 4.5em;
		}	
		
		.Copyright {
			text-align:left;
			padding-bottom: 0;
			}	
		
		.RKD { float: right; }		
		
}

@media all and (min-width: 60em) {

	/*the cdn logo in the footer*/
	footer:before {
		content: "";
		width: 117px;
		height: 43px;
		position: absolute;
		left: 0;
		right: 0;
		margin: auto;
		top: 5em;
		background-image: url(../../images/logo.svg);
		z-index: 5;
		opacity: 0.5
		}

}

/* =============================================================================================
	Plugin styles
============================================================================================= */

/*======================================
  Selectric v1.11.1
======================================*/

.selectric-wrapper {
  position: relative;
  cursor: pointer;
}

.selectric-responsive {
  width: 100%;
}

.selectric {
  border: 1px solid #DDD;
  background: #FFF;
  position: relative;
  transition: background-color 0.2s ease-in-out;
  }
	.selectric:hover {background-color: #F8F8F8;}

.selectric .label {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0 38px 0 10px;
  font-size: 16px;
  line-height: 38px;
  color: #9b191d;
  height: 38px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.selectric .button {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: 38px;
  height: 38px;
  color: #BBB;
  text-align: center;
  font: 0/0 a;
  *font: 20px/38px Lucida Sans Unicode, Arial Unicode MS, Arial;
  background: url(../../images/arrow-down-red.svg) no-repeat center;
  background-size: 18px auto;

}
/*.selectric .button:after {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-top-color: #BBB;
  border-bottom: none;
}*/

.selectric-focus .selectric {
  border-color: #AAA;
}

.selectric-hover .selectric {
  border-color: #C4C4C4;
}
.selectric-hover .selectric .button {
  color: #A2A2A2;
}
.selectric-hover .selectric .button:after {
  border-top-color: #A2A2A2;
}

.selectric-open {
  z-index: 9999;
}
.selectric-open .selectric {
  /*border-color: #C4C4C4;*/
  background-color: #F8F8F8;
}
.selectric-open .selectric-items {
  /*display: block;*/
    visibility: visible;
  opacity: 1;
  transition: all 0.25s ease-in-out;
  -webkit-transition: all 0.25s ease-in-out;
 /* -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
       -o-transform: translateY(0);
          transform: translateY(0);*/
  /*-webkit-transition: .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
          transition: .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);*/
}

.selectric-disabled {
  filter: alpha(opacity=50);
  opacity: 0.5;
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.selectric-hide-select {
  position: relative;
  overflow: hidden;
  width: 0;
  height: 0;
}
.selectric-hide-select select {
  position: absolute;
  left: -100%;
  display: none;
}

.selectric-hide-select.selectric-is-native {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
}
.selectric-hide-select.selectric-is-native select {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  border: none;
  z-index: 1;
  box-sizing: border-box;
  opacity: 0;
}	

.selectric-input {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 1px !important;
  height: 1px !important;
  outline: none !important;
  border: none !important;
  *font: 0/0 a !important;
  background: none !important;
}

.selectric-temp-show {
  position: absolute !important;
  visibility: hidden !important;
  display: block !important;
}

/* Items box */
.selectric-items {
  /*display: none;*/
  visibility: hidden;
  opacity: 0;
 /* -webkit-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
       -o-transform: translateY(-10px);
          transform: translateY(-10px);*/
  position: absolute;
  top: 100%;
  left: 0;
  background: #F8F8F8;
  /*border: 1px solid #C4C4C4;*/
  z-index: -1;
  /*box-shadow: 0 0 10px -6px;*/
  box-shadow: 0 1px 1px rgba(0,0,0,0.15);
}
.selectric-items .selectric-scroll {
  height: 100%;
  overflow: auto;
}
.selectric-above .selectric-items {
  top: auto;
  bottom: 100%;
}
.selectric-items ul, .selectric-items li {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 16px;
  line-height: 20px;
  min-height: 20px;
}
.selectric-items li {
  display: block;
  padding: 10px;
  color: #b72025;
  cursor: pointer;
  background-image: none;
  transition: all 0.25s ease-in-out;
  -webkit-transition: all 0.25s ease-in-out;
}
.selectric-items li.selected {
  /*background: #E0E0E0;
  color: #b72025;*/
  /*background: #0196ef;
  color: #ffffff;*/
  background: #9b191d;
    color: #FFF;
}
.selectric-items li:hover {
  /*background: #D5D5D5;
  color: #444;*/
  /*background: #0196ef;
    color: #ffffff;*/
    background: #9b191d;
    color: #FFF;
}
.selectric-items .disabled {
  filter: alpha(opacity=50);
  opacity: 0.5;
  cursor: default !important;
  background: none !important;
  color: #666 !important;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.selectric-items .selectric-group .selectric-group-label {
  font-weight: bold;
  padding-left: 10px;
  cursor: default;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background: none;
  color: #444;
}
.selectric-items .selectric-group.disabled li {
  filter: alpha(opacity=100);
  opacity: 1;
}
.selectric-items .selectric-group li {
  padding-left: 25px;
}



/* =============================================================================================
	ONE-OFF ALIGNMENT, MARGIN AND PADDING STYLES - CAN BE USED ON ANYTHING
============================================================================================= */

.AlignL {text-align:left; }
.AlignC {text-align:center; }
.AlignR {text-align:right; }

.MT1, .MT2, .MT3 { margin-top: 1em; }

.MB1, .MB2, .MB3, .MB4 { margin-bottom: 1em; }

.MT0 { margin-top: 0; }
.MB0 { margin-bottom: 0; }

.PT1, .PT2, .PT3 { padding-top: 1em; }

.PT05 {padding-top: 0.5em;}

.PB025 {padding-bottom: 0.25em;}
.PB05 {padding-bottom: 0.5em;}

.PB1, .PB2, .PB3 { padding-bottom: 1em; }

.PT0 { padding-top: 0; }
.PB0 { padding-bottom: 0; }

.P0 {padding: 0;}

.Hidden, .Hide {display: none;}
.Show {display: block;}

.Invisible {visibility: hidden;}
.Visible {visibility: visible;}

.DisplayTable {
	display: table;
	width: 100%;
	}

.DisplayTableRow {
	display: table-row;
	}	

.DisplayTableCell {
	display: table-cell;
	vertical-align: middle;
	/*vertical-align: middle;
	width: 100%;*/
	}


@media all and (min-width: 50em) {

	.FloatL {float: left;}
	.FloatR {float: right;}
	
	.AlignR-Desktop {text-align: right;}
	.AlignL-Desktop {text-align: left;}
	.AlignC-Desktop {text-align: center;}

	.PT0-Desktop {padding-top: 0;}

	.MT0-Desktop {margin-top: 0;}

	.PB0-Desktop {padding-bottom: 0;}

	.MT2 { margin-top: 2em; }
	.MT3 { margin-top: 3em; }
	
	.MB2 { margin-bottom: 2em; }
	.MB3 { margin-bottom: 3em; }
	.MB4 { margin-bottom: 4em; }
	
	.PT2 { padding-top: 2em; }
	.PT3 { padding-top: 3em; }
	
	.PB2 { padding-bottom: 2em; }
	.PB3 { padding-bottom: 3em; }

}

@media all and (max-width: 50em) {

	.PT0-Mobile {padding-top: 0;}

	.PB1-Mobile {padding-bottom: 1em}

	.MT1-Mobile {margin-top: 1em;}

}