﻿@charset "UTF-8";
/*
fluidra colours
#001A70 fluidra dark blue
#C6D2EF fluidra very light blue
#FFD100 fluidra yellow
#2BB4D3 fluidra sky blue
*/
/* CSS Document */
/*-------------------------------------------------------*/
/* site-wide styles                                      */
/*-------------------------------------------------------*/
/*@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700");*/
/*forum*/
/*forum end*/
/*forum*/
/*forum end*/
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	outline: 0;
}

*:before,
*:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

@font-face {
	font-family: 'Fluidra Praktika';
	src: url("fonts/fluidra/Fenotype-PraktikaRndRegular.eot"); /* IE9 Compat Modes */
	src: url("fonts/fluidra/Fenotype-PraktikaRndRegular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
	url("fonts/fluidra/Fenotype-PraktikaRndRegular.otf") format("opentype"), /* Open Type Font */
	url("fonts/fluidra/Fenotype-PraktikaRndRegular.svg") format("svg"), /* Legacy iOS */
	url("fonts/fluidra/Fenotype-PraktikaRndRegular.ttf") format("truetype"), /* Safari, Android, iOS */
	url("fonts/fluidra/Fenotype-PraktikaRndRegular.woff") format("woff"), /* Modern Browsers */
	url("fonts/fluidra/Fenotype-PraktikaRndRegular.woff2") format("woff2"); /* Modern Browsers */
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Fluidra Praktika';
	src: url("fonts/fluidra/Fenotype-PraktikaRndMedium.eot"); /* IE9 Compat Modes */
	src: url("fonts/fluidra/Fenotype-PraktikaRndMedium.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
	url("fonts/fluidra/Fenotype-PraktikaRndMedium.otf") format("opentype"), /* Open Type Font */
	url("fonts/fluidra/Fenotype-PraktikaRndMedium.svg") format("svg"), /* Legacy iOS */
	url("fonts/fluidra/Fenotype-PraktikaRndMedium.ttf") format("truetype"), /* Safari, Android, iOS */
	url("fonts/fluidra/Fenotype-PraktikaRndMedium.woff") format("woff"), /* Modern Browsers */
	url("fonts/fluidra/Fenotype-PraktikaRndMedium.woff2") format("woff2"); /* Modern Browsers */
	font-weight: bold;
	font-style: normal;
}



html {
	overflow-y: scroll;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	scroll-behavior: smooth; /* smooth scroll to in-page anchors */
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: #fff;
	-webkit-transition: opacity 0.25s ease-in-out;
	-moz-transition: opacity 0.25s ease-in-out;
	-ms-transition: opacity 0.25s ease-in-out;
	-o-transition: opacity 0.25s ease-in-out;
	transition: opacity 0.25s ease-in-out;
	/*opacity: 1 !important;*/
}

html, body {
	-webkit-overflow-scrolling: touch;
	z-index: 0;
	height: 100%;
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 16px;
	line-height: 150%;
	letter-spacing: 0.5px;
}

/*.normal p {
	margin: 10px 0;
}*/

@media screen and (max-width: 1000px) {
	.normal p {
		margin: 0;
	}
}

.safari {
	background-image: none !important;
}

*, button, a {
	outline: none;
	-webkit-tap-highlight-color: transparent !important;
	-webkit-tap-highlight-color: transparent !important;
}

img {
	border: 0;
}

ol, ul {
	margin-left: 16px;
}

input.svyWideText {
	/*	font-family: "Fluidra Praktika", Arial, sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;*/
}


/*textarea.svyWideText, textarea.svyTextArea {
	padding: 2px;
	font-family: "Fluidra Praktika", Arial, sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;
}*/

button.svyButton {
	-webkit-appearance: none;
}

table {
	border-collapse: collapse;
	margin: inherit;
}

/* Pagingnav Frontend */
.pagingnav-wrapper {
	clear: both;
	padding: 15px 0;
}

.pagingnav-wrapper .page-text {
	margin: 0 5px 0 0;
	font-weight: bold;
}

.pagingnav-wrapper select.svySelectBox {
	min-width: 45px;
}

/*end Pagingnav Frontend*/
/* savvy validate form validation styles */
.validation {
	display: none;
	position: relative;
}

.hide {
	display: none;
}

.validation .validation_outer, .validation .outer {
	background: url(../images/error_msg_arrow.png) left 15px bottom no-repeat;
	padding-bottom: 7px;
	position: absolute;
	top: -37px;
	left: -35px;
	z-index: 99;
	min-width: 200px;
	width: auto !important;
}

.validation .validation_outer:after,
.validation .outer:after {
	content: '';
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 7px solid #e30418;
	position: absolute;
	bottom: 0;
	left: 15px;
}

.validation .validation_inner, .validation .inner {
	background: #e30418;
	font-weight: bold;
	font-size: 11px;
	line-height: 15px;
	color: #fff;
	padding: 5px 10px;
	border-radius: 4px;
	/*white-space: nowrap;*/
	display: block;
}

textarea + .validation .validation_outer {
	top: -29px;
}

.validation.autoPosition {
	position: absolute;
}

.validation.autoPosition .validation_outer, .validation.autoPosition .outer {
	left: auto;
	top: auto;
}

/* end savvy validate form validation styles */
/* Responsive table and image styles for mobile */
.responsive-table-scroll {
	overflow: auto;
}

.responsive-image-scroll {
	overflow: auto;
}

.responsive-autoshrink {
	max-width: 100%;
}

.warning-message {
	color: #fff;
	font-size: 14px;
	text-align: center;
	vertical-align: middle;
	padding: 5px;
	margin-bottom: 4px;
	position: fixed;
	z-index: 100000;
	width: 100%;
	line-height: 150%;
	opacity: 0.8;
}

.warning-message.staging-server {
	background: #10ca68;
}

.warning-message.staging-server.conn-LVE {
	background: #ef4035;
}

.warning-message.old-browser {
	background: #fa9614;
}

.warning-message {
	background: #fa9614;
}

.warning-message.old-browser a {
	color: #fff;
}

.form-field .warning-message {
	width: auto;
	position: relative;
}

.warning-message.staging-server .close,
.warning-message.old-browser .close {
	position: absolute;
	right: 5px;
	top: 50%;
	margin-top: -11px;
	cursor: pointer;
	width: 22px;
	height: 22px;
}

@media screen and (max-width: 1000px) {
	.warning-message.staging-server .close,
	.warning-message.old-browser .close {
		position: absolute;
		text-indent: 1000px;
		white-space: nowrap;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		margin: 0;
	}
}

.warning-message.staging-server .close span,
.warning-message.old-browser .close span {
	display: none;
}

.svyGridLines {
	outline: 1px solid red;
}

/* settings */
.clear:before,
.clear:after {
	content: " ";
	display: table;
}

.clear:after {
	clear: both;
}

.float-leftl {
	float: left;
}

.float-right {
	float: right;
}

.text-align-left {
	text-align: right;
}

.text-align-right {
	text-align: right;
}

.text-align-center {
	text-align: center;
}

.bold, .b, b, strong {
	font-weight: bold;
	color: inherit;
}

.i, i, em {
	color: inherit;
	font-style: italic;
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
}

a.savvy-cms-edit-link:hover {
	background-color: white;
	color: #a20000;
	/*color: #2BB4D3;*/
}

a.savvy-cms-edit-link {
	position: relative;
	text-decoration: none;
	color: #fff;
	/*border: 2px dotted #bb0404;
	background-color: #ac5151 ;*/
	border: 2px dotted #2BB4D3;
	background-color: #2BB4D3;
	padding: 6px;
	text-align: center;
	z-index: 500;
	opacity: .8;
	display: none;
	border-radius: 3px;
	line-height: 1;
	text-transform: none;
	text-decoration: none;
	cursor: pointer;
	min-height: 30px;
	bottom: 33px;
	right: -6px;
}

.SavvyPageEditLink {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 15px;
	text-align: center;
	background-color: #666666;
	background-color: rgba(0, 0, 0, 0.7);
	line-height: 200%;
	z-index: 99999999999;
}



.SavvyPageEditLink a {
	line-height: 100%;
	color: #fff;
	border: 1px solid;
	text-decoration: none;
	padding: 8px 10px;
	font-size: 12px;
}

.SavvyPageEditLink a:hover {
	background-color: rgba(255, 255, 255, 0.1);
}

.SavvyPageEditLink a.close {
	float: right;
	cursor: pointer;
}

.infoRecallDialog .label {
	color: #001A70;
	font-weight: bold;
}

.bewebOfficeDebug {
	display: none;
	margin: 15px;
	border: 2px dotted green;
}

@media screen and (max-width: 540px) {
	.bewebOfficeDebug {
		display: none;
	}
}

.svyAutocomplete {
	position: relative;
	top: 4px;
	cursor: help;
}

.printer-btn {
	position: absolute;
	background-image: url(../images/printer.png);
	border: 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	height: 24px;
	width: 24px;
	right: 0;
}

/*.article-edit {
	display: none!important;
}*/

.adminnote {
	border: 1px dotted #000;
	background-color: #eee;
	padding: 5px;
	margin: 2px;
	margin-left: 0;
	max-width: 496px;
	line-height: 160%;
	font-size: 14px;
}


/*forum*/
/*forum end*/
/* Start TinyMCE normal styles */
.normal ol,
.normal ul {
	margin-left: 24px;
	padding: 0;
}

.normal ul {
	/*list-style: none outside none;*/
	margin-left: 0;
	padding: 0;
	padding-left: 26px;
}

.normal ul li {
	/*list-style-type: initial;*/
	margin-top: 10px;
	padding-left: 13px;
	margin-left: 0;
}

.normal ol li {
	margin-top: 10px;
	padding-left: 13px;
	margin-left: 0;
}

.normal p.image-caption {
	font-style: italic;
	margin: 5px 0 15px;
	text-align: center;
}


.normal a[href$='.pdf'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/PDF_small.gif) no-repeat left;
}

.normal a[href$='.doc'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/doc_small.gif) no-repeat left;
}

.normal a[href$='.docx'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/doc_small.gif) no-repeat left;
}

.normal a[href$='.xls'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/xls_small.gif) no-repeat left;
}

.normal a[href$='.xlsx'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/xls_small.gif) no-repeat left;
}

.normal a[href$='.ppt'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/ppt_small.gif) no-repeat left;
}

.normal a[href$='.pptx'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/ppt_small.gif) no-repeat left;
}

.normal a[href$='.zip'] {
	padding-left: 20px;
	background: transparent url(images/filetypes/zip_small.gif) no-repeat left;
}

.normal table {
	padding: 0;
	margin: 0 10px;
	border: 0;
	border-collapse: collapse;
	width: 100% !important;
}

.normal table td, .normal table th {
	padding: 5px;
	border: 0;
}

.normal table td p {
	/* FF fix */
	margin: 0;
}

.normal table.table-no-gridlines {
	padding: 0;
	margin: 0 0 10px 0;
	border: 0;
	border-collapse: collapse;
	text-align: left;
}

.normal table.table-no-gridlines tr td {
	padding: 5px;
	border: 0;
	vertical-align: top;
}

@media screen and (max-width: 780px) {
	.normal table.table-no-gridlines tr td {
		width: 50%;
		display: inline-block;
	}
}

@media screen and (max-width: 480px) {
	.normal table.table-no-gridlines tr td {
		width: 100%;
		display: block;
	}
}

.normal table.table-small {
	padding: 0;
	margin: 0 0 10px 0;
	border: 0;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	border-collapse: collapse;
	color: #777;
	font-size: 12px;
}

.normal table.table-small td {
	padding: 5px;
	border: 0;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.normal table.table-gridlines {
	padding: 0;
	margin: 20px 0;
	border: 0;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	border-collapse: collapse;
}

.normal table.table-gridlines td, .normal table.table-gridlines th {
	padding: 5px;
	border: 0;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.normal iframe {
	width: 100%;
}

.normal img {
	max-width: 100%;
	height: auto;
}

body#tinymce {
	margin: 10px;
	background: #fff;
}

body#tinymce p.image-caption {
	font-style: italic;
	margin: 5px 0 15px;
	text-align: center;
}

body#tinymce table {
	border: 1px dashed #ccc;
}

body#tinymce table td {
	border: 1px dashed #ccc;
}

body#tinymce table.table-small td {
	padding: 5px;
	border: 0;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

/* end admin tinymce override */
/* End TinyMCE normal styles */

.shared-section-wrapper {
	width: 100%;
}

.shared-section-wrapper.with-template-page .has-toc {
	/* todo this is the wrong class! */
	width: 76%;
}

/*
.shared-section-wrapper.with-template-special,
.shared-section-wrapper.with-template-sectionpage {
	width: 100%;
}*/

.shared-section-wrapper .section-content {
	width: 100%;
	padding-right: 33px;
	position: relative;
}


@media screen and (max-width: 1300px) {
	.shared-section-wrapper .section-content {
		padding-right: 10px;
	}
}

@media screen and (max-width: 1201px) {
	.shared-section-wrapper .section-content {
		padding-right: 5px;
	}
}

@media screen and (max-width: 1000px) {
	.shared-section-wrapper .section-content {
		padding-right: 0;
	}
}

.shared-section-wrapper.page-content {
	/*padding-left: $navigationWidth+4px;*/
	padding-left: 260px;
	/*transition: 0.5s all ease-out;  moved to .sidebar-animate */
}

.shared-section-wrapper.page-content.closed-header {
	padding-left: 40px;
}

@media screen and (max-width: 1000px) {
	.shared-section-wrapper.page-content.closed-header {
		padding-left: 0;
	}
}

@media screen and (max-width: 1000px) {
	.shared-section-wrapper.page-content {
		width: 100%;
		padding-left: 0;
	}
}



.shared-section-wrapper.footer {
	width: 100%;
	transition: 0.5s all ease-out;
	clear: both; /*2020-07-30jn added*/
	border-top: 1px solid black;
}

@media screen and (min-width: 1000px) {
	.shared-section-wrapper.footer {
		padding-left: 264px;
	}

	.shared-section-wrapper.footer.closed-header {
		padding-left: 40px;
	}
}

.shared-section-wrapper.footer .section-content {
	/*min-height: 218px;*/
	padding: 20px;
}

.mobile-only {
	display: none !important;
}

@media screen and (max-width: 1000px) {
	.mobile-only {
		display: block !important;
	}
}

.desktop-only {
	display: none !important;
}

@media screen and (min-width: 1024px) {
	.desktop-only {
		display: block !important;
	}

	span.desktop-only {
		display: initial !important;
	}
}


@media screen and (max-width: 480px) {
	.hide-on-mobile {
		display: none;
	}
}


form#SearchForm {
	text-align: right;
	padding: 11px 20px;
}

@media screen and (min-width: 1000px) {
	form#SearchForm {
		text-align: center;
		padding: 0;
	}
}

form#SearchForm input {
	font-size: 17px;
}

/*
.searchfield {
	position: absolute;
	display: block;
	top: 0;
	right: 80px;
	z-index: 5;
}

.searchfield form#SearchForm {
	background-color: transparent;
	margin: 0;
}

.searchfield form#SearchForm input {
	padding: 10px 20px;
	border: 1px solid #ccc;
	width: 200px;
}

.searchfield form#SearchForm input[type=submit] {
	text-transform: uppercase;
	font-weight: bold;
	color: white;
	width: auto;
	background-color: #001A70;
	border: 1px solid #001A70;
	height: 45px;
	-webkit-appearance: none;
	line-height: 100%;
}
.searchfield form#SearchForm input[type=submit]:hover {
	background-color: #2BB4D3;
	border-color: #2BB4D3;
}
.searchfield:hover {
	background-color: transparent;
}
*/




.searchfield {
	position: absolute;
	display: block;
	top: 0;
	right: 80px;
	z-index: 5;
}


@media screen and (max-width: 1000px) {
	.searchfield {
		top: -3px;
		right: 0;
	}
}


@media screen and (max-width: 1000px) {
	.searchfield {
		position: fixed;
		top: 0;
		left: 0;
		background-color: #fff;
		-moz-transition: top .5s ease-out;
		-o-transition: top .5s ease-out;
		-webkit-transition: top .5s ease-out;
		transition: top .5s ease-out;
		box-shadow: 0 1px 5px 0 rgba(50, 50, 50, 0.5);
	}

	.searchfield.open-search {
		top: 80px;
	}
}



.searchfield form#SearchForm {
	background-color: transparent;
	margin: 0;
}

@media screen and (max-width: 480px) {
	.searchfield form#SearchForm {
		text-align: left;
	}
}


.searchfield form#SearchForm input {
	padding: 10px 20px;
	width: 200px;
}

@media screen and (max-width: 1000px) {
	.searchfield form#SearchForm input {
		width: 100%;
	}
}


.searchfield form#SearchForm input[type=submit] {
	border: 0;
	width: auto;
	height: 45px;
	line-height: 100%;
}

.searchfield form#SearchForm input[type=submit]:hover {
	color: #fff;
	background-color: #2BB4D3;
}

@media screen and (max-width: 480px) {
	.searchfield form#SearchForm input[type=submit] {
		width: 68px;
	}
}


.show-search-icon {
	position: absolute;
	top: 26px;
	right: 107px;
	color: white;
	display: none;
	font-size: 20px;
	cursor: pointer;
}

@media screen and (max-width: 1000px) {

	.show-search-icon {
		display: block;
	}
}

.fa.fa-lg.fa-search,
.fa.fa-lg.fa-times {
	font-weight: normal;
}

.show-search-icon.open .fa.fa-lg.fa-search {
	display: none;
}

.fa.fa-lg.fa-times {
	display: none;
	font-size: 39px;
	font-weight: lighter;
	margin-top: -3px;
}

.show-search-icon.open .fa.fa-lg.fa-times {
	display: inline-block;
}

@media screen and (max-width: 1135px) {
	.header-go-btn {
		display: none !important;
	}
}

.header-contact-us {
	position: absolute;
	display: block;
	top: 0;
	right: 368px;
	z-index: 5;
	padding: 11px 20px;
}

@media screen and (max-width: 1185px) {
	.header-contact-us {
		display: none;
	}
}

@media screen and (max-width: 1000px) {
	.header-contact-us {
		padding: 0;
		position: fixed;
		top: 18px;
		right: 110px;
		z-index: 10;
	}

	.header-contact-us .btn {
		border: 1px solid;
	}
}

@media screen and (max-width: 655px) {
	.header-contact-us {
		right: 155px;
	}
}

@media screen and (max-width: 460px) {
	.header-contact-us {
		display: none;
	}
}



.InfoMessage, .ErrorMessage, .WarningMessage, .alert-error {
	position: fixed;
	top: -200px;
	/* move off screen */
	width: 400px;
	left: 50%;
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 200;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	opacity: 0;
	line-height: 150%;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font-weight: bold;
	text-align: center;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.4);
	border: 1px solid;
	padding: 8px 14px 8px 14px;
	margin-top: 10px;
	margin-bottom: 10px;
	color: #fff;
}

.InfoMessage.showing, .ErrorMessage.showing, .WarningMessage.showing, .alert-error {
	top: 0;
	opacity: 1;
}

.InfoMessage,
.InfoMessageBasic {
	background-color: #73df01;
	border-color: #73df01;
}


.ErrorMessage,
.alert-error {
	background-color: #da1d1a;
	border-color: #da1d1a;
}

.ErrorMessage a,
.ErrorMessage a:hover,
.alert-error a,
.alert-error a:hover {
	color: #fff;
}

.ErrorMessage .close,
.ErrorMessage .close:hover,
.alert-error .close,
.alert-error .close:hover {
	text-decoration: none;
}


.WarningMessage,
.validation-summary-errors {
	background-color: #ff8a1a;
	border-color: #ff8a1a;
	padding: 10px;
}

/* Clearfix */
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

a {
	/*color: #2BB4D3;*/
	color: #001A70;
	/*color: #7030a0;*/
}

a:hover {
	color: #2BB4D3;
	/*color: #001A70;*/
	/*text-decoration: none;*/
}

.ui-dialog .ui-dialog-buttonpane button,
.btn, input[type=button], input[type=submit], .go-button {
	display: inline-block;
	color: #fff;
	background-color: #001A70;
	padding: 10px 12px;
	line-height: 145%;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	-ms-border-radius: 4px;
	border-radius: 4px;
	border: none;
	font-size: 16px;
	/*font-weight: bold; mn 2020-02-24 not really needed to be bold */
	min-height: 45px;
	text-decoration: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	white-space: nowrap;
	text-align: center;
	position: relative;
}

.btn:hover {
	background-color: #2BB4D3 !important;
}

.btn.new-draft {
	background-color: #001A70 !important;
}

.btn.new-draft:hover {
	background-color: #fff !important;
	color: #001A70 !important;
}


.svySubformRow .svyDeleteChildBtn.btn.btn-mini {
	padding: 0;
	min-height: 0;
	background: transparent;
}

.svySubformRow .svyDeleteChildBtn.svy-disabled {
	color: #ccc;
	cursor: not-allowed !important;
}

.svySubformRow .svyDeleteChildBtn.btn.btn-mini .fa-override {
	margin: 0;
}

input[type=submit].btn:focus {
	background-color: #FFD100;
}


.btn.btn-mini .fa-spinner.fa-override,
.fa-spinner.fa-override {
	margin: 0;
	vertical-align: baseline; /*default*/
	line-height: 100%;
}

.list-page-spinner {
	margin-top: 10px;
}

.list-page-spinner .fa-spinner.fa-override {
	color: #001A70;
	font-size: 24px;
}


.btn.svy-disabled {
	background-color: #ccc;
	cursor: not-allowed;
}

.btn .fa-override {
	font-size: 25px;
	vertical-align: sub;
	margin-right: 7px;
}



.btn.btn-mini .fa-override {
	vertical-align: middle;
	font-size: 12px;
	margin-right: 5px;
}

.btn .fa-override.fa-after {
	margin-right: 0;
	margin-left: 7px;
}

.btn.btn-mini .fa-override.fa-after {
	margin-right: 0;
	margin-left: 5px;
}





.btn.btn-more .fa-override {
	margin: 0;
	margin-left: 7px;
}

.btn.btn-mini.btn-more .fa-override {
	margin-left: 5px;
}


.btn.btn-quote-view {
	min-width: 160px;
}

/*@media screen and (max-width: 480px) {

	.btn.btn-quote-view {
		width: 100%;
	}
}*/


.btn.btn-no-text .fa-override {
	margin: 0;
}

.btn.btn-mini.btn-no-text .fa-override {
	font-size: 14px;
}

.gallery-list .ghost-btn:hover,
.ui-dialog .ui-dialog-buttonpane button:hover,
.ui-dialog .ui-dialog-buttonpane button:active,
.btn:hover, input[type=button]:hover, .go-button:hover {
	color: #fff;
	background-color: #2BB4D3;
}

input[type=button].disabled {
	color: black;
	background-color: #ccc;
	cursor: not-allowed;
}
a.disabled.basket-tracking-btn {
	color: black;
	background-color: #ccc;	
	cursor: pointer;

}
a.disabled {
	color: black;
	background-color: #ccc;
	cursor: not-allowed;
}

.btn-mini, input[type=submit].btn-mini, input[type=button].btn-mini {
	padding: 5px 8px;
	font-size: 14px;
	/*height: 22px;*/
	/*line-height: 22px;*/
	min-height: 22px;
}

.SavvyPageEditLink {
	display: none;
}

.ghost-btn {
	background-color: transparent;
	color: #001A70;
	border: 1px solid;
}
/*
.ghost-btn:hover {
	color: #2BB4D3;
	border: 1px solid;
	background-color: transparent;
}
*/
.gallery-list .ghost-btn,
.ghost-btn-light {
	background-color: transparent;
	color: #fff;
	border: 1px solid;
}
/*
.gallery-list .ghost-btn:hover,
.ghost-btn-light:hover {
	color: #2BB4D3;
	background-color: transparent;
}
*/

.ghost-btn-light.ok-got-it-btn {
	background-color: transparent;
	color: black;
	border: 1px solid black;
}

.ghost-btn-light.ok-got-it-btn:hover {
	background-color: black !important;
	color: #FFD100;
	border: 1px solid white;
}


h1, h2, h3 {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	line-height: 120%;
	font-weight: normal;
}

h4, h5, h6 {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-weight: bold;
}

h1 {
	font-size: 35px;
	line-height: 100%;
	/*margin-left: -4px;  NO, find the instance you have a problem with and fix it there, this affects ALL H1's*/
}

h3 small {
	font-size: 0.5em;
}

.main-body-content {
	margin-top: 20px;
}

@media screen and (max-width: 1000px) {
	h1 {
		font-size: 28px;
	}

	.main-body-content {
		margin-top: 15px;
	}
}

@media screen and (max-width: 480px) {
	h1 {
		font-size: 25px;
	}

	.main-body-content {
		margin-top: 10px;
	}
}

h2 {
	font-size: 25px;
	line-height: 120%;
	color: #001A70;
	margin-bottom: 10px;
}

h2 .btn {
	float: right;
	margin-top: 5px;
}

@media screen and (max-width: 480px) {
	h2 {
		font-size: 22px;
	}

	h2 .btn {
		margin-top: 0;
	}
}

.normal h3,
.normal h3 span {
	color: #001A70;
}

h3 {
	font-size: 20px;
	color: #001A70;
}

.normal h3, .normal h4 {
	margin-bottom: 10px;
}

h4 {
	font-size: 24px;
}

@media screen and (max-width: 1000px) {
	h4 {
		font-size: 18px;
	}
}

@media screen and (max-width: 480px) {
	h4 {
		font-size: 17px;
	}
}

h5 {
	font-size: 18px;
}

@media screen and (max-width: 1000px) {
	h5 {
		font-size: 16px;
	}
}

@media screen and (max-width: 480px) {
	/*  shouldn't get any smaller thatn the standard text size.
	h5 {
		font-size: 14px;
	}
	*/
}

h6 {
	font-size: 16px;
}

.principal-wrapper {
	min-height: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: -250px;
	position: relative;
}

body:not(.public-site) .principal-wrapper {
	max-width: 1600px; /* mn added this to stop everything stretching too wide */
}

@media print {
	.principal-wrapper {
		height: auto !important;
	}
}

.sticky-footer-push {
	height: 300px;
	clear: both;
}

.container {
	max-width: 1610px;
	width: 100%;
	/*margin: 0 auto; do not center*/
	margin: 0;
	/*padding: 14px 0 20px 30px;    2020-03-15 mn trying to close up gaps between top content and next part */
	padding: 14px 0 0 30px;
}

@media screen and (max-width: 1300px) {
	.container {
		padding-left: 20px;
	}
}

@media screen and (max-width: 1000px) {
	.container {
		padding: 5px 15px;
	}
}

@media screen and (max-width: 480px) {
	.container {
		padding: 5px;
	}
}

.container.standard-element {
	padding-top: 10px;
}

@media screen and (max-width: 1000px) {
	.container {
		/*xpadding-top: 0;*/
	}
}

.container.tile-wrapper {
	padding-top: 17px;
}



.container.standard-element h1 {
	color: #001A70;
}
/*
@media screen and (max-width: 1000px) {
	.container.standard-element h1 {
		padding-left: 3px;
	}
}
*/
.container .main-post-container {
	position: fixed;
	background-color: #fff;
	width: 100%;
	/*border-bottom: 1px solid #808080;*/
	padding-bottom: 30px;
	z-index: 1;
	top: 0;
	margin-bottom: 50px;
	padding-top: 50px;
}

.container .main-post-container .post-border {
	display: block;
	height: 1px;
	background-color: #808080;
	margin: 20px 0;
}

.tableItems {
	margin-top: 20px;
	width: 100%;
}

.tableItems tr td {
	padding: 10px;
}

.tableItems tr .modelsOnFloorTitle {
	border-bottom: 2px solid #001A70;
	padding-left: 5px;
	font-size: 18px;
}

.tableItems tr.modelOnFloor {
	cursor: pointer;
}

.tableItems tr.modelOnFloor td {
	/*color: #ffffff;*/
	/*background-color: $mainthemecolor;*/
	border-top: 1px solid #001A70;
	font: bold 16px Arial, Helvetica, sans-serif;
	padding: 5px 15px 5px 5px;
	vertical-align: bottom;
}

.tableItems tr:nth-child(1) {
	border-top: 2px solid #001A70;
}

.tableItems tr:nth-child(1) td {
	/*font-weight: bold;*/
}

.kitImage {
	max-width: 350px;
	width: 100%;
}

.svyAdmin {
	margin: 1px;
	padding: 2px;
	border-radius: 3px;
	display: inline-block;
	color: #fff;
	border: 2px dotted #bb0404; /*2020-02-19jn leave this red*/
	background-color: #ac5151 !important;
	/*border: 2px dotted #5f90f0;
	background-color: #7798d9;*/
	line-height: 1;
	text-transform: none;
	text-decoration: none;
	cursor: pointer;
	opacity: .6;
	min-height: 0;
}

.svyAdmin:hover {
	background-color: #5581d8;
	color: #fff;
}

div.svyError {
	display: block;
	border: 2px dotted #bb0404;
	background-color: #ac5151;
	color: #eee;
	padding: 5px;
	margin-bottom: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
span.svyError {
	border: 2px dotted #bb0404;
	background-color: #ac5151;
	color: #eee;
	padding: 5px;
	margin-bottom: 10px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.stock-details {
	display: none;
}

.mobileTableWrap {
	position: relative;
}

@media screen and (max-width: 1280px) {
	.mobileTableWrap {
		overflow-x: auto;
		width: 100%;
		display: block;
	}
}

@media screen and (max-width: 480px) {
	.nomobile {
		display: none;
	}
}

.helpPanelWrap {
	border: 2px solid #dddddd;
	border-radius: 6px;
	padding: 8px;
}

/*forum*/
/*forum end*/
.slogan {
	position: relative;
	bottom: 100%;
	right: 0;
	color: #000;
	font-size: 16px;
	font-style: italic;
	text-align: right;
	line-height: 0;
}

.slogan .slogan-message {
	display: inline-block;
	font-size: 11px;
	vertical-align: middle;
	margin-right: 15px;
	margin-top: -20px;
}

@media screen and (min-width: 480px) {
	.slogan .slogan-message {
		font-size: 16px;
	}
}

.footer {
	position: relative;
}

.footer a {
	text-decoration: none;
}

.footer .copyright {
	color: #000;
	padding-left: 6px;
	font-size: 11px;
}

@media screen and (min-width: 1000px) {
	.footer .copyright {
		/*position: absolute;
		top: 20px;
		left: 20px;
		margin-bottom: auto;
		max-width: 192px;*/
	}
}

.footer ul.footer-nav {
	list-style: none;
	display: block;
	margin: 0;
}

@media screen and (min-width: 1000px) {
	.footer ul.footer-nav {
		/*margin-left: 200px;*/
		margin-top: 7px;
	}
}

.footer ul.footer-nav li {
	display: block;
	margin-bottom: 10px;
	text-align: center;
}

@media screen and (min-width: 780px) {
	.footer ul.footer-nav li {
		display: inline-block;
		margin-right: 10px;
		margin-bottom: 3px;
		text-align: left;
	}
}

.footer ul.footer-nav li a {
	padding: 6px;
	text-decoration: none;
	/*color: #808080;
	font-weight: bold;
	text-transform: uppercase;*/
	font-size: 11px;
}

.footer ul.footer-nav li .subNavigation-footer {
	display: none;
}

/*forum*/
/*forum end*/


.infoIcon {
	position: absolute;
	right: 24px;
	/*background-color: #001A70;*/
	/*border-radius: 50% 50% 50% 0;*/
	border-radius: 50%;
	width: 20px;
	height: 20px;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	transform: rotate(225deg);
	line-height: 100%;
	top: 12px;
	z-index: 10;
	/*+ a::after {
			border-left-color: #ffffff;
		}*/
}

.infoIcon span {
	transform: rotate(-225deg);
	display: inline-block;
	border-radius: 50%;
	color: #fff;
	/*background-color: #001A70;*/
	width: 16px;
	height: 16px;
	margin: 3px;
	padding: 3px;
}

.infoIcon.icon3 {
	transform: rotate(45deg);
	right: 7px;
	top: 10px;
}

.infoIcon.icon3 span {
	transform: rotate(-45deg);
	padding: 2px;
}

.infoIcon.iconDown {
	transform: rotate(-45deg);
	right: auto;
	top: auto;
}

.infoIcon.iconDown span {
	transform: rotate(45deg);
	text-align: center;
	margin-left: 0;
	margin-right: 1px;
}

.active .infoIcon.icon1 {
	display: none;
}

td .infoIcon {
	display: inline-block;
	position: relative;
	right: auto;
	top: auto;
}

.infoIcon {
	/*display: none !important;*/
	/* mn 2020-02-24 remvoing for now */
	/*2024-11-01 jn restored for consumer leads*/
}

.closed-header .infoIcon {
	display: none !important;
}

.back-to-top {
	color: #001A70;
	float: right;
	font-size: 12px;
}

.back-to-top span {
	display: inline-block;
}

.back-to-top span::after {
	font-size: 20px;
	content: '»';
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	display: block;
	padding-bottom: 6px;
}

.back-to-top a {
	margin-left: 3px;
}

.article-list .js-articles:first-of-type .back-to-top {
	display: none;
}

/*forum*/
/*forum end*/
input:not([type=radio]):not([type=checkbox]):not(.btn),
textarea,
select {
	padding: 8px 10px;
	/*border: 1px solid #ccc; THIS KILLS ALL HOVER AND FOCUS BORDERS*/
	-ms-border-radius: 4px;
	border-radius: 4px;
	/*vertical-align: top;   bad for date picker icon */
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 16px;
	letter-spacing: 1px;
	min-height: 45px;
}

/*TW65631 Category box width - AA 20240805 - minor adjustments to fit items in one line */
select#scope {
	font-size: 14px;
}

input[type=checkbox].svyCheckBox:not(:checked) + label:hover:before,
input[type=checkbox].svyCheckBox:checked + label:hover:before,
input:hover,
textarea:hover,
select:hover {
	border-color: #2BB4D3;
}

input[type=checkbox].svyCheckBox:not(:checked) + label:focus:before,
input[type=checkbox].svyCheckBox:checked + label:focus:before,
input:focus,
textarea:focus,
select:focus {
	border-color: #FFD100;
	font-size: 16px;
}



input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	letter-spacing: 1px;
	font-size: 16px;
	background-color: #37bd00;
}

/*select {
	-webkit-appearance: none;
	-moz-appearance: none;
}
.savvy-select-wrapper {
	position:relative;
	display: inline-block;
	width: 100%;
	vertical-align: middle;
}
.savvy-select-wrapper:after {
	content: '';
	display: block;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 50%;
	-moz-transform: translateY(-30%);
	-ms-transform: translateY(-30%);
	-o-transform: translateY(-30%);
	-webkit-transform: translateY(-30%);
	transform: translateY(-30%);
	right: 15px;
	border: 5px solid transparent;
	border-top-color: #5a5a5a;
}*/


input[type="file"] {
	display: none !important;
}

label {
	cursor: pointer;
}

input[type=checkbox].svyCheckBox {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	width: 1px;
	height: 1px;
	display: block;
	border: 0;
	outline: none;
	position: absolute;
	/*left: 0;      mn 2020-09-01 fixed this page scrolling/jumping to top every time you click a checkbox
	top: -2px;*/
	z-index: 1 !important;
	/*display: none;*/
}

.svyCheckboxes .checkboxes {
	position: relative;
	margin-bottom: 4px;
}

.svyCheckboxes label,
.svyCheckboxes label span {
	cursor: pointer;
}

input[type="checkbox"].svyCheckBox + label {
	vertical-align: top;
	cursor: pointer;
}


input[type="checkbox"].svyCheckBox.svyDisabled + label {
	cursor: not-allowed !important;
}

input[type="checkbox"].svyCheckBox + label span {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(images/check_radio_sprite.png) white -6px -6px no-repeat;
	vertical-align: bottom;
	margin-right: 8px;
	position: relative;
	z-index: 2;
}

input[type="checkbox"].svyCheckBox + label:hover span {
	background-position: -130px -6px;
}


input[type="checkbox"].svyCheckBox:checked + label span {
	background-position: -6px -36px;
}

input[type="checkbox"].svyCheckBox:checked + label:hover span {
	background-position: -130px -36px;
}

input[type="checkbox"].svyCheckBox + label:active span,
input[type="checkbox"].svyCheckBox:focus + label span {
	background-position: -68px -6px;
}

input[type="checkbox"].svyCheckBox:checked:active + label span,
input[type="checkbox"]:checked:focus + label span {
	background-position: -68px -36px;
}


input[type=radio].svyRadio {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
	width: 1px;
	height: 1px;
	display: block;
	border: 0;
	outline: none;
	position: absolute;
	left: 0;
	top: -2px;
	z-index: 1 !important;
	/*display: none;*/
}

input[type="radio"].svyRadio + label span {
	display: inline-block;
	width: 26px;
	height: 26px;
	background: url(images/check_radio_sprite.png) -36px -5px no-repeat;
	vertical-align: bottom;
	margin-right: 8px;
	position: relative;
	z-index: 2;
}

input[type="radio"].svyRadio + label:hover span {
	background-position: -160px -5px;
}

input[type="radio"].svyRadio:checked + label span {
	background-position: -36px -35px;
}

input[type="radio"].svyRadio:checked + label:hover span {
	background-position: -160px -35px;
}

input[type="radio"].svyRadio:checked:active + label span,
input[type="radio"].svyRadio:checked:focus + label span {
	background-position: -98px -35px;
}

/* white checkboxes */
input[type="radio"].svyRadio.white + label span {
	background-position: -36px -125px;
}


input[type="radio"].svyRadio.white + label:hover span {
	background-position: -160px -5px;
}

input[type="radio"].svyRadio.white:checked + label span {
	background-position: -36px -155px;
}

input[type="radio"].svyRadio.white:checked + label:hover span {
	background-position: -160px -155px;
}

input[type="radio"].svyRadio.white:focus:checked + label span,
input[type="radio"].svyRadio.white:focus:checked + label:hover span {
	background-position: -98px -155px;
}


.searchFormResults select.pagingnav {
	width: 100%;
}

/* these must be listed seperately to work! */
form ::-webkit-input-placeholder {
	/* WebKit, Blink, Edge */
	color: #ccc;
}

form :-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	color: #ccc;
	opacity: 1;
}

form ::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	color: #ccc;
	opacity: 1;
}

form :-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	color: #ccc;
}

form .data-placeholder-on {
	color: #ccc;
}

form .spinner {
	display: none;
}

form.field-wrapper {
	padding: 0;
	background-color: transparent;
}

ul.form-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.form-list.wide-form {
	max-width: 1000px;
}
/*
form ul.form-list li {
	margin-top: 10px;
}
*/

ul.form-list li:first-child {
	margin-top: 0;
}

ul.form-list li.action {
	margin-top: 20px;
}
/*
ul.form-list li input[type="text"],
ul.form-list li textarea,
ul.form-list li select.svySelectBox {
	width: 300px;
}
*/

@media screen and (max-width: 1000px) {
	ul.form-list li input[type="text"],
	ul.form-list li textarea,
	ul.form-list li select {
		width: 100%;
	}
}

ul.form-list li input[type="text"]#Amount,
ul.form-list li textarea#Amount,
ul.form-list li select.svySelectBox#Amount {
	width: 155px;
	margin-left: 5px;
}


form#SearchForm {
	text-align: right;
	padding: 11px 20px;
}

#dealerPricePlaceholder .fa-override {
	font-size: 18px;
}

#dealerPricePlaceholder .warning {
	color: #ff4500;
}

@media screen and (max-width: 1000px) {
	form#SearchForm {
		text-align: center;
	}
}

@media screen and (max-width: 655px) {
	form#SearchForm {
		padding: 10px 15px;
	}
}

@media screen and (max-width: 480px) {
	form#SearchForm {
		padding: 10px 5px;
	}
}

form#SearchForm input {
	font-size: 17px;
}

.yesno {
	-webkit-appearance: radio;
}

.MemberLogin .sticky-footer {
	display: none;
}

.MemberLogin .alert {
	position: absolute;
	padding: 8px 14px;
	color: #c09853;
	background-color: #fcf8e3;
	border: 1px solid #fbeed5;
	width: 300px;
	left: 50%;
	margin-left: -150px;
	margin-top: -70px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	text-align: center;
}

.MemberLogin .alert.alert-error {
	color: #b94a48;
	background-color: #f2dede;
	border-color: #eed3d7;
}

.MemberLogin .alert.alert-info {
	color: #3a87ad;
	background-color: #d9edf7;
	border-color: #bce8f1;
}

.memberlogin.shared-section-wrapper.page-content {
	padding: 100px 0 0;
}




.memberlogin.shared-section-wrapper.page-content form {
	width: 300px;
	padding: 0;
	margin: 0 auto;
	font-family: "Fluidra Praktika", Arial, sans-serif;
}

.memberlogin.shared-section-wrapper.page-content form.loginform tr:last-child td {
	/*border-bottom: 1px solid #7030a0;*/
	border-bottom: 1px solid #001A70;
	position: relative;
}

.memberlogin.shared-section-wrapper.page-content form.loginform tr:last-child td .slogan-moto-img {
	position: absolute;
	right: -15px;
	bottom: 0;
}

.memberlogin.shared-section-wrapper.page-content form.forgotpasswordform {
	margin-top: 0;
	padding-top: 0;
}

.memberlogin.shared-section-wrapper.page-content form.forgotpasswordform tr.forgothead {
	text-align: right;
}

.memberlogin.shared-section-wrapper.page-content form.forgotpasswordform tr.forgothead a {
	font-size: 12px;
	cursor: pointer;
}

.memberlogin.shared-section-wrapper.page-content form table {
	width: 100%;
	margin: 0;
}

.memberlogin.shared-section-wrapper.page-content form table td {
	padding: 15px 0;
	white-space: nowrap;
}

.memberlogin.shared-section-wrapper.page-content form table td input[type=text],
.memberlogin.shared-section-wrapper.page-content form table td input[type=password] {
	width: 100%;
}

.memberlogin.shared-section-wrapper.page-content form table td.wrap {
	white-space: normal;
	font-size: 12px;
}

.memberlogin.shared-section-wrapper.page-content form table .dataheading {
	position: relative;
	color: #001A70;
	/*color: #7030a0;*/
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 17px;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	border-bottom: 1px solid #001A70;
	/*border-bottom: 1px solid #7030a0;*/
}

/*@media screen and (max-width: 1000px) {    // 2024-01-31 mn too small for no reason
	.memberlogin.shared-section-wrapper.page-content form table .dataheading {
		font-size: 13px;
	}

	.memberlogin.shared-section-wrapper.page-content form table td {
		font-size: 12px;
	}
}*/

.memberlogin.shared-section-wrapper.page-content .login-wrapper {
	width: 100%;
}

/*forum*/
/*forum end*/
#SearchAgainForm {
	display: none;
}

a.showall {
	float: right;
	margin-top: 18px;
	text-decoration: none;
}

@media screen and (max-width: 1000px) {
	a.showall {
		margin-top: 12px;
	}
}

@media screen and (max-width: 480px) {
	a.showall {
		margin-top: 4px;
	}
}

h3.search-area-title {
	float: left;
	float: left;
}

.search-results {
	list-style: none;
	border-top: 1px solid #ccc;
	margin: 10px 0 30px;
}

.search-results .search-result {
	padding: 20px 10px;
	border-bottom: 1px dotted #ccc;
	cursor: pointer;
}

.search-results .search-result:hover {
	background-color: #f1f1f1;
}

.search-results .search-result a.image {
	float: left;
	margin-right: 20px;
	width: 100px;
	height: 100px;
}

.search-results .search-result a.searchTitle {
	text-decoration: none;
}

.search-results .search-result .info {
	display: inline;
}

.shared-tile-list {
	display: flex;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
	justify-content: flex-start;
	-ms-flex-direction: row;
	flex-direction: row;
	margin: 0;
	width: 100%;
	max-width: 1550px;
	font-size: 0;
}
/*
@media screen and (min-width: 1000px) {
	.shared-tile-list {
		padding-right: 30px;
	}
}
*/
.shared-tile-list .tile {
	-webkit-flex: 0 0 100%;
	-ms-flex: 0 0 100%;
	-o-flex: 0 0 100%;
	flex: 0 0 100%;
	display: inline-block;
	font-size: 14px;
	overflow: hidden;
	margin: 0 0 17px 0;
	min-width: 290px;
}


@media screen and (min-width: 650px) {
	.shared-tile-list .tile {
		-webkit-flex: 0 0 50%;
		-ms-flex: 0 0 50%;
		-o-flex: 0 0 50%;
		flex: 0 0 50%;
		margin-right: 0;
		padding: 0 8px;
	}
}

@media screen and (min-width: 1280px) {
	.shared-tile-list .tile {
		-webkit-flex: 0 0 33.33%;
		-ms-flex: 0 0 33.33%;
		-o-flex: 0 0 33.33%;
		flex: 0 0 33.33%;
		/*margin-right: 2.8%;*/
		/*margin-bottom: 2.8%;*/
	}

	.shared-tile-list .tile:nth-child(odd) {
		/*margin-right: 2.8%;*/
		/*margin-bottom: 2.8%;*/
	}

	.shared-tile-list .tile:nth-child(3n) {
		margin-right: 0;
	}
}

@media screen and (min-width: 1605px) {
	.shared-tile-list .tile {
		-webkit-flex: 0 0 25%;
		-ms-flex: 0 0 25%;
		-o-flex: 0 0 25%;
		flex: 0 0 25%;
		/*margin-right: 1.9%;*/
		/*margin-bottom: 1.9%;*/
	}

	.shared-tile-list .tile:nth-child(odd),
	.shared-tile-list .tile:nth-child(3n) {
		/*margin-right: 1.9%;*/
		/*margin-bottom: 1.9%;*/
	}

	.shared-tile-list .tile:nth-child(4n) {
		margin-right: 0;
	}
}

.shared-tile-list .tile .tile-container {
	position: relative;
	padding-top: 60%;
	background: center center no-repeat;
	background-size: contain;
	/*background-size: cover;*/
	background-color: #001a70;
	background-blend-mode: soft-light;
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
	-ms-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
	-ms-border-radius: 10px;
	border-radius: 10px;
	overflow: hidden;
}

.shared-tile-list .tile.gallery-image-tile .tile-container {
	/*background-color: #f1f1f1;*/
	background-color: transparent;
	background-blend-mode: normal;
	border: 1px solid rgba(0, 0, 0, 0.5);
}

.shared-tile-list .tile.article-document-tile .tile-container {
	padding-top: 0;
}

/*
@media screen and (min-width: 1170px) {
	.shared-tile-list .tile .tile-container {
		height: 270px;
	}
}
*/
.shared-tile-list .tile .tile-container .tile-title {
	/*font-style: italic;*/
	position: absolute;
	bottom: 20px;
	left: 25px;
	font-size: 24px;
	color: #fff;
	z-index: 2;
	pointer-events: none;
	line-height: 100%;
	/*
	width: 100%;
	padding: 10px;
	height: 68px;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.65);
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
	-ms-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
	*/
}
/*
.shared-tile-list .tile .tile-container .tile-title span {
	display: block;
	position: relative;
	top: 50%;
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
*/

.shared-tile-list .tile .tile-container .tile-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
	-ms-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

.shared-tile-list .tile .tile-container .background-image {
	position: relative;
	z-index: 0;
}

.shared-tile-list .tile .tile-container .background-image img {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

.shared-tile-list .tile .tile-container:hover {
	background-color: #2BB4D3;
}

.shared-tile-list .tile.gallery-image-tile .tile-container:hover {
	background-color: transparent;
}

/*
.shared-tile-list .tile .tile-container:hover .tile-title {
	background-color: transparent;
}
*/
.shared-tile-list .tile .tile-container:hover .tile-link {
	/*border-top: 10px solid rgba(208, 32, 43, 0.5);
	border-right: 10px solid rgba(208, 32, 43, 0.5);
	border-left: 10px solid rgba(208, 32, 43, 0.5);
	border-bottom: 68px solid rgba(208, 32, 43, 0.5);
	border-top: 10px solid #001A70;
	border-right: 10px solid #001A70;
	border-left: 10px solid #001A70;
	border-bottom: 68px solid #001A70;
	background-color:transparent;
	background-color: rgba(43,180,211,0.8)*/
}

.shared-tile-list .tile .tile-container:hover .tile-link:after {
	content: '';
	position: absolute;
	bottom: 0;
	height: 0;
}

.shared-tile-list .tile .svyAdmin {
	position: relative;
	top: -16px;
	opacity: .8;
	/*left: -213px;*/
	z-index: 2;
}

.tile-special {
	padding: 17px;
	/*margin-bottom: 5px;
	margin-left: 18px;*/
	background-image: url(images/pattern-gray.jpg);
}

@media screen and (min-width: 1000px) {
	.tile-special {
		padding: 19px 0 0 30px;
		margin-left: 0;
	}
}

.tile-special .tile {
	padding: 0;
	vertical-align: middle;
}

@media screen and (min-width: 780px) {
	.shared-tile-list .tile:last-child,
	.tile-special .tile {
		margin-bottom: 17px;
		/*width: 30%;
		max-width: 340px;*/
	}
}
/*
.tile-special .tile .tile-container {
	height: 270px;
}
*/
.row-even td, .row-even {
	background-color: #fffdfd;
}

.row-odd td, .row-odd {
	background-color: #eee;
}

/*forum*/
/*forum end*/
.article-list {
	margin: 0;
	list-style: none;
}

.article-list li {
	margin-bottom: 20px;
}

.article-list li .svyAdmin {
	float: right;
	display: inline;
}

.article-list .tile-wrapper {
	padding: 0;
	margin-top: 15px;
}


.tile-wrapper .gallery-image-tile .document-info {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.65);
	color: white;
	padding: 12px;
}

.tile-wrapper .gallery-image-tile .document-info .document-title {
	width: 100%;
	text-align: center;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
	color: #fff;
}

.tile-wrapper .gallery-image-tile:hover .document-info .document-details {
	max-height: 260px;
}

.tile-wrapper .gallery-image-tile .document-info .document-details {
	max-height: 260px;
	overflow: hidden;
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
	-ms-transition: 0.3s all ease-in-out;
	-o-transition: 0.3s all ease-in-out;
	transition: 0.3s all ease-in-out;
}

@media screen and (min-width: 1000px) {
	.tile-wrapper .gallery-image-tile .document-info .document-details {
		max-height: 0;
	}
}

.tile-wrapper .gallery-image-tile .document-info .document-date {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 2px;
}

.tile-wrapper .gallery-image-tile .document-info .document-actions {
	margin-top: 15px;
}

.document-actions a.icon-small:hover {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}


.tile-wrapper .gallery-image-tile .document-info .ghost-btn {
	float: right;
}

.tile-wrapper .gallery-image-tile .document-info .normal p {
	font-size: 12px;
	line-height: 150%;
}

.tile-wrapper .article-document-tile {
	vertical-align: top;
}

@media screen and (min-width: 780px) {
	.tile-wrapper .article-document-tile {
		width: 50%;
	}
}

@media screen and (min-width: 1170px) {
	.tile-wrapper .article-document-tile {
		width: 30%;
		/*20180829jn set this to 30 for my tall screen*/
		/*max-width: 314px;*/
	}
}

.tile-wrapper .article-document-tile .tile-container {
	height: 100%;
	background-color: #f1f1f1;
}

.tile-wrapper .article-document-tile .tile-container:hover {
	background-color: #f1f1f1;
}

.tile-wrapper .article-document-tile .icon-large {
	position: absolute;
	left: 14px;
	top: 14px;
}

.tile-wrapper .article-document-tile .icon-large-cover-thumb {
	position: absolute;
	left: 14px;
	top: 14px;
}

.tile-wrapper .article-document-tile .document-info {
	/*xposition: absolute;*/
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	padding: 14px 14px 75px 80px;
}

.tile-wrapper .article-document-tile .document-title {
	font-size: 18px;
	margin-bottom: 10px;
	line-height: 130%;
	font-weight: 400;
}

.tile-wrapper .article-document-tile .document-date {
	display: block;
	margin-bottom: 16px;
	line-height: 1;
}
/*
.tile-wrapper .article-document-tile .normal {
	margin-bottom: 38px;
}
*/
.tile-wrapper .article-document-tile .normal p {
	/*font-size: 12px;   mn this is pretty small */
	font-size: 14px;
	line-height: 140%;
}

.tile-wrapper .article-document-tile .document-actions {
	display: block;
	position: absolute;
	bottom: 14px;
	right: 14px;
}

.tile-wrapper .article-document-tile .icon-small {
	margin-right: 0;
}

.tile-wrapper .article-document-tile .icon-small:hover {
	border-radius: 4px;
}

.tile-wrapper .article-document-tile .icon-small:after {
	content: '';
	width: 0;
}

/*forum*/
/*forum end*/
.icon-small {
	position: relative;
	margin-right: 30px;
}

.icon-small:after {
	position: absolute;
	content: '';
	top: 0;
	left: 100%;
	width: 30px;
	height: 45px; /*45px is the size of the buttons*/
	background: url(images/filetypes/generic_sml.png) center center no-repeat #fff;
	border-radius: 0 4px 4px 0;
}

.icon-small.pdf:after {
	background: url(images/filetypes/pdf_sml.png) center center no-repeat #fff;
}

.icon-small.png:after {
	background: url(images/filetypes/png_sml.png) center center no-repeat #fff;
}

.icon-small.jpg:after {
	background: url(images/filetypes/jpg_sml.png) center center no-repeat #fff;
}

.icon-small.ppt:after {
	background: url(images/filetypes/ppt_sml.png) center center no-repeat #fff;
}

.icon-small.zip:after {
	background: url(images/filetypes/zip_sml.png) center center no-repeat #fff;
}

.icon-small.doc:after, .icon-small.docx:after {
	background: url(images/filetypes/doc_sml.png) center center no-repeat #fff;
}

.icon-small.xls:after, .icon-small.xlsx:after {
	background: url(images/filetypes/xls_sml.png) center center no-repeat #fff;
}

.icon-large-cover-thumb {
	position: relative;
	width: 52px;
	height: 62px;
	box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.3);
	background-color: white;
	background-repeat: no-repeat;
	background-position: center center;
}

.icon-large-cover-thumb[data-cropstyle=contain] {
	background-size: 80%;
}

.icon-large {
	position: relative;
	width: 52px;
	height: 62px;
	box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.3);
}

.icon-large:after {
	position: absolute;
	content: '';
	left: 52%;
	transform: translateX(-50%);
	width: 50px;
	height: 62px;
	background: url(images/filetypes/generic_lrg.png) center center no-repeat #fff;
}

.icon-large.pdf:after {
	background: url(images/filetypes/pdf_lrg.png) center center no-repeat #fff;
}

.icon-large.png:after {
	background: url(images/filetypes/png_lrg.png) center center no-repeat #fff;
}

.icon-large.jpg:after {
	background: url(images/filetypes/jpg_lrg.png) center center no-repeat #fff;
}

.icon-large.ppt:after {
	background: url(images/filetypes/ppt_lrg.png) center center no-repeat #fff;
}

.icon-large.zip:after {
	background: url(images/filetypes/zip_lrg.png) center center no-repeat #fff;
}

.icon-large.doc:after, .icon-large.docx:after {
	background: url(images/filetypes/doc_lrg.png) center center no-repeat #fff;
}

.icon-large.xls:after, .icon-large.xlsx:after {
	background: url(images/filetypes/xls_lrg.png) center center no-repeat #fff;
}

/*forum*/
/*forum end*/
#Breadcrumb {
	/*padding-left: 260px;*/
	-webkit-transition: 0.5s all ease-out;
	-moz-transition: 0.5s all ease-out;
	-ms-transition: 0.5s all ease-out;
	-o-transition: 0.5s all ease-out;
	transition: 0.5s all ease-out;
	position: relative;
	z-index: 2;
	font-size: 13px;
	line-height: 120%;
}

@media screen and (max-width: 1000px) {
	#Breadcrumb {
		padding-left: 0;
		margin-top: 100px;
		font-size: 12px;
		line-height: 120%;
	}
}

/*#Breadcrumb.closed-header {
	padding-left: 40px;
}

#Breadcrumb .breadcrumb {
	height: 23px;
}

#Breadcrumb .breadcrumb ol {
	list-style: none;
	padding: 0;
	margin-left: 30px;
}

@media screen and (max-width: 1300px) {
	#Breadcrumb .breadcrumb ol {
		margin-left: 20px;
	}
}

@media screen and (max-width: 1000px) {
	#Breadcrumb .breadcrumb ol {
		margin-left: 16px;
	}
}

#Breadcrumb .breadcrumb ol li {
	float: left;
	margin: 5px 5px 0 0; 
	font-size: 13px;
}

#Breadcrumb .breadcrumb ol li:before {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 13px;
	content: "»";
}

#Breadcrumb .breadcrumb ol li:first-child:before {
	content: "";
}*/

/*#Breadcrumb .breadcrumb ol li:first-child:before {
	content: "★";
}*/

@media screen and (max-width: 480px) {
	#Breadcrumb .breadcrumb ol {
		margin-left: 0;
	}

	#Breadcrumb .breadcrumb ol li {
		font-size: 12px;
		/*margin: 0 5px 0 5px;*/
	}

	#Breadcrumb .breadcrumb ol li:before {
		font-size: 14px;
	}
}


.search-refinement {
	background-image: url(images/pattern-gray.jpg);
	padding: 15px; /*10px 15px 15px;*/
	margin-bottom: 15px;
	width: 100%;
}
/*
.search-refinement .pre-search-field-filters {
	margin-bottom:10px;
}
*/
.search-refinement .pre-search-field-filters .label {
	text-align: right;
	margin-right: 10px;
}

.search-refinement .date-filter {
	margin: 0 10px 10px 0;
	display: inline-block;
}

.search-refinement .search-field {
	position: relative;
	display: inline-block;
	width: 80%;
}

.search-refinement .search-field input[type=text] {
	width: 100%;
}



@media screen and (max-width: 1000px) {
	.search-refinement {
		padding: 10px;
	}
}

.search-refinement h6 {
	margin-bottom: 10px;
}

/*.search-refinement .btn {
	border: 1px solid #001A70;
}*/

.search-refinement .btn.active {
	background-color: #FFD100;
	color: black;
}


.search-refinement .field-wrapper {
	margin-top: 10px;
	margin-bottom: 10px;
}

.search-refinement .refinement-list {
	list-style: none;
}

.search-refinement .refinement-list li {
	float: left;
	width: 32%;
	margin-right: 2%;
	margin-bottom: 10px;
}

.search-refinement .refinement-list li:nth-child(3) {
	margin-right: 0;
}

@media screen and (max-width: 780px) {
	.search-refinement .refinement-list li {
		width: 49%;
		margin-right: 0;
	}

	.search-refinement .refinement-list li:nth-child(odd) {
		margin-right: 1%;
	}

	.search-refinement .refinement-list li:nth-child(even) {
		margin-left: 1%;
	}
}


@media screen and (max-width: 580px) {

	.search-refinement .date-filter {
		display: block;
	}

	.search-refinement .date-filter .label {
		display: inline-block;
		width: 100px;
		text-align: left;
	}

	.search-refinement .search-field {
		width: calc(100% - 95px);
	}
}

@media screen and (max-width: 348px) {

	.search-refinement .search-field {
		width: 100%;
		margin-bottom: 10px;
	}

	.search-refinement .go-button {
		width: 100%;
	}
}


@media screen and (max-width: 480px) {


	.search-refinement .refinement-list li {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}

.search-refinement .refinement-list li.actions {
	width: 100%;
	margin: 8px 0 0;
}

.search-refinement .refinement-list li label {
	display: block;
	margin-bottom: 5px;
}

.search-refinement .refinement-list li .field select.svySelectBox {
	width: 100%;
}

.search-refinement .filter-items {
	font-size: 14px;
	margin-top: 0;
}

/*.search-refinement .filter-items .btn {
  padding: 5px;
  font-size: 10px;
	min-height:20px;
}*/

form.refine-panel {
	margin-top: 0;
}

.refine-panel {
	background-color: transparent;
	padding: 5px 0;
}

.refine-panel div {
	/*white-space:nowrap;*/
	vertical-align: middle;
}

.refine-panel .panel-title {
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	vertical-align: text-top;
	margin-right: 10px;
}

.refine-panel .panel-form {
	font-size: 14px;
}

.refine-panel .panel-form input {
	margin: 0 10px;
	font-size: 12px;
}

.refine-panel .panel-form input[type=text] {
	width: 40%;
}

@media screen and (max-width: 480px) {

	.refine-panel .panel-form input[type=text] {
		width: 100%;
		margin: 0;
		margin-bottom: 5px;
	}
}

.refine-panel .panel-actions {
	font-size: 14px;
	white-space: nowrap;
}

.refine-panel .panel-actions .btn {
	padding: 6px 11px;
	text-align: center;
	margin: 0;
	padding-top: 10px;
}

.refine-panel .panel-actions .reset-form {
	cursor: pointer;
	margin-left: 10px;
	font-size: 12px;
	text-decoration: underline;
}

.show-no-results {
	color: #98051a;
	font-weight: bold;
	display: none;
}



.newOrder {
	border: 2px solid #001A70;
	-ms-border-radius: 3px;
	border-radius: 3px;
	padding: 2px;
	margin: 0px;
	display: block;
	font-size: 10px;
	width: 113px;
}

.invShipInfo {
	background: #2BB4D3;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px;
	color: #FFFFFF;
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 11px;
	font-weight: 100;
	padding: 2px;
	box-shadow: 1px 1px 11px 0px #000000;
	-webkit-box-shadow: 1px 1px 11px 0px #000000;
	-moz-box-shadow: 1px 1px 11px 0px #000000;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
}

.invShipInfo:hover {
	background: #001A70;
	color: #FFFFFF;
	text-decoration: none;
}

/*forum*/
/*forum end*/
.sof-nothing {
	font-style: italic;
}

.sof-total {
	font-style: italic;
}

.stock-on-hand-container .modelName {
	/*color: $mainthemecolor;*/
}

.RecallHeaderAlert, .recallLineAlert {
	color: green;
	padding: 5px;
	border: 1px solid orange;
}


/* Forms */


sup {
	color: red;
}

.mandatory-fields-note {
	font-style: italic;
	font-size: small;
	margin: 0 auto 20px auto;
}

.form-row {
	max-width: 650px;
	margin-top: 10px;
	list-style: none;
}


.form-row td { /* form row, if a tr cannot have a margin*/
	margin-top: 10px;
}

.form-row:first-child {
	margin-top: 0;
}


.full-width .form-row {
	max-width: 100%;
}

.form-label,
.form-field {
	vertical-align: top;
	min-height: 40px;
	/*margin-bottom: 10px;*/
	display: block;
	float: left;
	position: relative;
}

.form-field {
	width: 60%;
}

.form-label {
	padding: 11px 20px 0 0;
	width: 40%;
	max-width: 260px;
}

.full-width {
	width: 100%;
	max-width: 100%;
}

.form-label.full-width {
	padding-right: 0; /* for login form */
	max-width: 100%;
}

.form-field.no-field, .form-field.view-field {
	padding: 11px 0 0;
}

.form-field.radio-list {
	padding: 9px 0 0;
}

.form-field.radio-list .savvyRadioList {
	display: block;
	padding-right: 0;
	margin-bottom: 5px;
}

.form-field .svyAttachmentCntr {
	padding: 11px 0 0;
}


.form-row.form-row-section .form-label {
	font-weight: bold;
	font-size: 18px;
	padding: 10px 0;
	margin: 10px 0;
	color: #2BB4D3;
	border-bottom: 1px solid #001A70;
	width: 100%;
	max-width: 100%;
}

.form-field {
	display: inline-block;
	vertical-align: top;
}

.form-field input[type=password],
.form-field input[type=text],
.form-field textarea,
.form-field select {
	/*width: 262px;*/
	width: 100%;
}

.form-field-item {
	display: flex;
}

.form-field-items {
	width: 50%;
	display: inline-block;
}

.form-field-items-label {
	width: 40%;
	text-align: right;
	padding-top: 18px;
	padding-right: 15px;
}

.form-field-items-field {
	width: 60%;
}


@media screen and (max-width: 480px) {
	.no-phone {
		display: none;
	}

	.form-field {
		width: 100%;
	}

	.form-label {
		width: 100%;
		margin-bottom: 0;
		min-height: 0;
	}

	.form-label.no-label-text {
		display: none;
	}

	.form-field input[type=password],
	.form-field input[type=text] {
		width: 100%;
	}
}

.form-field a:not(.btn):not(.select2-choice) {
	text-decoration: underline;
	cursor: pointer;
}

.datetimewrap {
	position: relative;
}

.datetimewrap .ui-datepicker-trigger {
	position: absolute;
	right: 10px;
	top: 3px;
}

.form-notice-text {
	padding-bottom: 20px;
}
/* End Forms */


.section-content.forum-list h2 .forum-actions {
	/*float: right;*/
	white-space: nowrap;
}

@media screen and (max-width: 1170px) {
	.section-content.forum-list h2 .forum-actions {
		width: 100%;
		margin-top: 20px;
	}
}

@media screen and (max-width: 1000px) {
	.section-content.forum-list h2 .forum-actions {
		text-align: left;
	}
}

.section-content.forum-list h2 .forum-actions label {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #fff;
}

@media screen and (max-width: 1000px) {
	.section-content.forum-list h2 .forum-actions label {
		display: block;
	}
}

.section-content.forum-list h2 .forum-actions .btn {
	line-height: 150%;
}

.section-content.forum-list h2 .forum-actions select {
	width: 320px;
}

@media screen and (max-width: 1000px) {
	.section-content.forum-list h2 .forum-actions select {
		display: block;
		margin-bottom: 10px;
	}
}

@media screen and (max-width: 480px) {
	.section-content.forum-list h2 .forum-actions select {
		display: block;
		width: 100%;
	}
}

.section-content.forum-list #ForumPostList {
	list-style-type: none;
	/*list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);*/
	border-top: 1px solid #808080;
	margin-top: 30px;
}

.section-content.forum-list #ForumPostList li {
	border-bottom: 1px solid #808080;
	cursor: pointer;
	padding: 15px;
}

.section-content.forum-list #ForumPostList li.trade {
	background-color: #cecece;
}

.section-content.forum-list #ForumPostList li.trade.withimage .post-content {
	float: left;
	width: 78%;
	margin-left: 2%;
}

@media screen and (max-width: 480px) {
	.section-content.forum-list #ForumPostList li.trade.withimage .post-content {
		float: none;
		width: 100%;
		margin-left: 0;
	}
}

.section-content.forum-list #ForumPostList li.trade.withimage .post-image {
	float: left;
	width: 20%;
}

@media screen and (max-width: 480px) {
	.section-content.forum-list #ForumPostList li.trade.withimage .post-image {
		width: 100%;
	}
}

.section-content.forum-list #ForumPostList li.trade.withimage .post-image img {
	width: 100%;
	height: auto;
}

.section-content.forum-list #ForumPostList li.trade .post-content h5 {
	max-width: 75%;
}

.section-content.forum-list #ForumPostList li.trade .post-content .post-topic {
	color: #ccc;
	background: #dadada;
	padding: 7px 10px;
	margin-top: -15px;
	margin-right: -15px;
}

.section-content.forum-list #ForumPostList li .post-content h5 {
	font-size: 20px;
	float: left;
	margin-top: 3px;
}

.section-content.forum-list #ForumPostList li .post-content h5:hover {
	color: #2BB4D3;
}

@media screen and (max-width: 780px) {
	.section-content.forum-list #ForumPostList li .post-content h5 {
		font-size: 18px;
	}
}

@media screen and (max-width: 480px) {
	.section-content.forum-list #ForumPostList li .post-content h5 {
		font-size: 16px;
	}
}

.section-content.forum-list #ForumPostList li .post-content h5 .badge {
	margin-right: 10px;
	margin-top: -3px;
}

.section-content.forum-list #ForumPostList li .post-content .post-topic {
	color: #dbdbdb;
	text-transform: uppercase;
	float: right;
	font-weight: bold;
	letter-spacing: 0.3px;
}

@media screen and (max-width: 480px) {
	.section-content.forum-list #ForumPostList li .post-content .post-topic {
		font-size: 14px;
	}
}

.section-content.forum-list #ForumPostList li .post-content .post-item-info {
	font-style: italic;
	margin: 5px 0;
}

.section-content.forum-list #ForumPostList li .post-content .post-item-info .post-item-author {
	float: left;
}

.section-content.forum-list #ForumPostList li .post-content .post-item-info .post-item-date {
	float: right;
}

.section-content.forum-list #ForumPostList li .post-content .post-reply-count {
	margin-top: 10px;
	font-weight: bold;
}

.section-content.forum-list #ForumPostList li .post-content .post-reply-count.noreplies {
	font-weight: normal;
}

.section-content.forum-list #ForumPostList li .post-content .post-reply-count:hover {
	color: #2BB4D3;
}

.section-content.forum-list #ForumPostList li .post-content .post-reply-count span {
	font-weight: bold;
	margin-left: 10px;
}

.section-content.forum-list #ForumPostList li:hover {
	background-color: #dadada;
}

.section-content .post-list-actions {
	text-align: center;
	padding: 20px 0;
}

.section-content .post-list-actions .loadmore-btn {
	display: none;
}

.section-content .post-list-actions .loadmore-btn .post-count {
	font-weight: bold;
}

.section-content.forum-post .post-content {
	margin-top: 10px;
}

.section-content.forum-post .post-image {
	float: left;
	margin: 0 15px 10px 0;
	width: 30%;
}

@media screen and (max-width: 1000px) {
	.section-content.forum-post .post-image {
		float: none;
		width: 100%;
	}
}

.section-content.forum-post .post-image img {
	width: 100%;
	height: auto;
}

.section-content.forum-post .post-like-wrapper {
	margin: 20px 0 0;
}

.section-content.forum-post .post-like-wrapper .post-likes {
	font-size: 12px;
}

.section-content.forum-post .post-replies {
	/*margin-top: 40px;*/
	position: relative;
	margin-top: 330px;
	/*border-top: 1px solid $maincolor;*/
}

.section-content.forum-post .post-replies h3 {
	margin: 20px 0;
}

.section-content.forum-post .post-replies .reply-list {
	list-style-type: none;
	/*list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);*/
	margin-top: 20px;
}

.section-content.forum-post .post-replies .reply-list li {
	margin-bottom: 30px;
}

.section-content.forum-post .post-replies .reply-list li.child {
	padding-left: 1.5%;
	margin-left: 1.5%;
	border-left: 1px solid #808080;
}

.section-content #PostFormWrapper h3 {
	float: left;
}

.section-content #PostFormWrapper .requirements {
	float: left;
	font-size: 11px;
	margin: 15px 0 0 10px;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper .requirements {
		float: right;
		margin: 0;
	}
}

.section-content #PostFormWrapper ul {
	list-style-type: none;
	/*list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);*/
}

.section-content #PostFormWrapper ul li {
	padding: 15px;
	float: left;
	width: 100%;
	position: relative;
	background-color: #ccc;
	border-radius: 10px;
	margin-bottom: 15px;
}

.section-content #PostFormWrapper ul li input {
	margin-left: 15px;
}

.section-content #PostFormWrapper ul li .forum-post-title, .section-content #PostFormWrapper ul li .svyPictureContainer {
	margin-left: 15px;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper ul li .mceWrapper .mceFirst .mceToolbar td a {
		width: 17px;
		margin-right: 0;
	}
}

.section-content #PostFormWrapper ul li.picture-option .svyFiledragProgess {
	width: auto !important;
	height: auto;
	line-height: 100%;
	margin-top: 20px;
}

.section-content #PostFormWrapper ul li.picture-option .svyFiledragLive img {
	max-width: 320px;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper ul li.picture-option .svyFiledragLive img {
		max-width: 100%;
	}
}

.section-content #PostFormWrapper ul li.picture-option #svyPasteImageLink_Picture,
.section-content #PostFormWrapper ul li.picture-option #svyDragImageLink_Picture {
	display: none !important;
}

.section-content #PostFormWrapper ul li.half {
	width: 50%;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper ul li.half {
		width: 100%;
	}
}

.section-content #PostFormWrapper ul li.half:nth-child(odd) {
	padding-right: 1%;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper ul li.half:nth-child(odd) {
		padding-right: 0;
	}
}

.section-content #PostFormWrapper ul li.half:nth-child(even) {
	padding-left: 1%;
}

.section-content #PostFormWrapper ul li label {
	display: block;
	padding-left: 17px;
	margin-bottom: 5px;
	width: 100%;
	font-weight: bold;
}

@media screen and (max-width: 480px) {
	.section-content #PostFormWrapper ul li label {
		padding-left: 0;
	}
}

.section-content #PostFormWrapper ul li #AgreedTerms + label {
	padding-left: 40px;
	margin-bottom: 0;
	cursor: pointer;
	width: auto;
	display: inline-block;
}

.section-content #PostFormWrapper ul li .mceWrapper {
	width: 100%;
}

.section-content #PostFormWrapper ul li .bodyTextHtmlValidation {
	right: 150px;
	position: absolute;
}

.section-content #PostFormWrapper ul li .agreedTermsValidation {
	position: absolute;
	left: 28px;
}

.section-content #PostFormWrapper ul li .svyPicContainer #svyDragImageLink_Picture,
.section-content #PostFormWrapper ul li .svyPicContainer #svyPasteImageLink_Picture {
	display: none;
}

.section-content #PostFormWrapper ul li .svyPicContainer input[type=file] {
	min-height: 34px;
	max-width: 180px;
	position: relative;
	z-index: 5;
	opacity: 0;
	cursor: pointer;
}

.section-content #PostFormWrapper ul li .svyPicContainer .btn {
	position: absolute;
	left: 0;
	min-width: 180px;
	text-align: center;
	z-index: 0;
	margin-top: 2px;
}

.section-content #PostFormWrapper ul li .svyPicContainer .svyCancelPaste .btn {
	position: relative;
}

.section-content #PostFormWrapper ul li.actions {
	text-align: right;
}

.section-content #ProcessingPost {
	display: none;
	margin: 10px 0;
}

.section-content #PostResponse {
	display: none;
	margin: 10px 0;
}

#ForumListItemTemplate {
	display: none;
}

.forum-post h1 {
	font-size: 48px;
}

.forum-post h2 {
	font-size: 38px;
}

.btn.unlike, .btn.like {
	width: 80px;
}

/* Begin Page Specific Styles*/
/*Logo

}*/

.public-head {
	width: 100%;
	background-color: #001A70;
	color: white;
	padding: 20px;
	position: relative;
}

.public-head-inner {
	max-width: 1400px;
	margin: 0 auto;
	position: relative;
}

.public-head a {
	text-decoration: none;
}

.public-head a.portal-title {
	color: white;
	font-size: 22px;
	position: absolute;
	right: 20px;
	top: 50%;
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.public-head a.portal-logo {
	line-height: 0;
	display: block;
}

.public-head a.portal-logo img {
	width: 300px;
	height: auto;
}

@media screen and (max-width: 480px) {
	.public-head a.portal-title {
		font-size: 18px;
	}

	.public-head a.portal-logo img {
		width: 135px;
	}
}




/* End Page Specific Styles*/





.icon-on-tile-container {
	/*background-color: rgba(0,0,0,0.2);*/
	width: 100%;
	height: 100%;
}

.icon-on-tile-round-shape {
	position: absolute;
	/*top: 15%;*/
	/*top: calc(50% - 68px);*/
	top: 20px; /* //calc(50% - 95px);*/
	left: 25px; /* 50%;
	transform: translate(-50%, calc(50% - 68px));*/
	color: #56669c;
	font-size: 40px;
	text-align: center;
	background-color: #c7d2f0;
	border-radius: 50%;
	/*padding: 45px 50px;*/
	width: 85px;
	max-width: 85px;
	height: 85px;
	max-height: 85px;
}

.icon-on-tile {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

/*.icon-on-tile {
	position: absolute;
	top: calc(50% - 80px);
	left: 50%;
	transform: translate(-50%, calc(50% - 68px));
	color: #ffffff;
	font-size: 85px !important;
	text-align: center;
	background-color: #001A70;
	border-radius: 50%;
	padding: 18px 20px;
}*/

/*@media screen and (max-width: 1000px) {
	.icon-on-tile {
		width:31%;
	}
}*/

/*.select2-container {
	width: 40%;
}*/

.document-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.document-list-item {
	margin-bottom: 10px;
}

.pdf-btn {
	padding-left: 30px;
	background-image: url(images/filetypes/PDF_small.gif);
	background-repeat: no-repeat;
	background-position: center left 5px;
}

/*.svyFiledragLive img {
	width: 25%;
}*/

.tocify-item.active {
	font-weight: bold;
}

@media screen and (max-width: 1000px) {
	#toc {
		display: none;
	}

	/* mn 2020-04-18 added side margins */

	.shared-section-wrapper.page-content {
		width: calc(100% - 20px);
		margin-left: 10px;
		margin-right: 10px;
		overflow-wrap: break-word;
	}

	.search-refinement {
		margin-left: -10px;
		margin-right: -10px;
		width: calc(100% + 20px);
	}

	.mobileTableWrap {
		margin-left: -15px;
		margin-right: -15px;
		padding-left: 30px;
		padding-right: 30px;
		width: calc(100% + 30px);
	}
}

.rolling-index {
	display: none;
	background-color: white;
	z-index: 1;
}

.tocify-extend-page {
	display: none;
}

.highlighted {
	color: blue;
}

/*.profile-info, .breadcrumb  {
	background-color: #C6D2EF;
}*/

/*.bread-login-info {
	padding: 17px 0 5px 30px;
	font-size: 14px;
}


@media screen and (max-width: 1300px) {
	.bread-login-info {
		padding-left: 20px;
	}
}

@media screen and (max-width: 1000px) {
	.bread-login-info {
		padding-left: 20px;
	}
}

@media screen and (max-width: 480px) {
	.bread-login-info {
		font-size: 13px;
		padding: 5px;
		padding-left: 15px;
	}
}*/

.profile-info-image {
	vertical-align: middle;
	float: left;
}

.profile-info-image img {
	-ms-border-radius: 50%;
	border-radius: 50%;
}


.profile-item {
	display: inline-block;
	margin-right: 5px;
}

.profile-role {
	margin-left: 5px;
	margin-right: 5px;
}

.profile-actions {
	/*display: block;*/
}

.profile-actions a {
	margin-right: 5px;
}

.profile-actions a.profile-signout {
	font-weight: normal;
}


blockquote {
	font-family: "Fluidra Praktika", Arial, sans-serif;
	font-style: italic;
}

.page-bottom-edit-button a {
	text-align: left;
	margin: 20px;
}

.mobile-header-help-contact {
	display: none;
}



.helpTextIcon {
	cursor: help;
}



/*search*/

/*search end*/



/* PRODUCT LIST */

.product-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}

.product-item {
	margin: 0 3px 3px;
	display: inline-block;
	padding: 0;
	border: 1px solid rgba(0,0,0,0.1);
	background-color: rgba(0,0,0,0.1);
	flex-grow: 0;
	flex-shrink: 1;
	/*flex-basis: 18%;*/
	flex-basis: 19.53%; /* fits 5 across, for large screen - see media queries below */
	position: relative;
	display: flex;
	align-items: flex-start;
}

.product-item:hover {
	border-color: #000;
}

.product-item-image-wrapper,
.product-item-image-bg {
	width: 110px;
}

.product-item-image-wrapper {
	float: left;
	position: relative;
	z-index: 2;
	line-height: 0;
}

.product-item-image-bg {
	background-color: #fff;
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: 0;
	left: 0;
}

.product-item-image {
	width: 100%;
}

.product-item-image img {
	width: 100%;
	height: auto;
}

.product-item-info {
	/*width: 68%;*/
	width: calc(100% - 110px);
}

.product-item-info.no-picture {
	width: 100%;
	/*width: calc(100% - 110px);*/
}


.product-item-info {
	padding: 10px 10px 50px;
	float: left;
}


.product-item-actions {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0 10px 10px 0;
	z-index: 3; /* overlay on top of image if needed */
}

.product-item-action {
	display: inline-block;
	text-decoration: none;
	white-space: nowrap;
	margin: 5px 0 0 5px;
}

.product-item-actions .product-item-action {
	float: right;
}

.product-item-no-orderable {
	font-size: 13px;
	margin-left: 6px;
	margin-right: 6px;
	margin-top: 10px;
	display: inline-block;
}

.product-list .sticker {
	font-size: 12px;
}

.product-list .btn-mini {
	font-size: 12px;
}
.product-list .btn-mini .fa-override {
	font-size: 14px;
}

.whats-new .product-item-info {
	padding-bottom: 60px; /*has bigger buttons*/
	width: 100%;
}

.whats-new .product-item-name {
	font-size: 16px;
	margin-bottom: 10px;
}

.whats-new .product-item-info > .fa-override {
	font-size: 24px;
	position: absolute;
	bottom: 20px;
	left: 10px;
}


@media screen and (max-width: 480px) {
	.product-item-info {
		padding: 5px 5px 40px;
	}

	.product-item-actions {
		padding: 0 5px 5px 0;
	}
}

.product-item-action.info-link {
}

.product-item-action.info-link .info-label {
	/*	display: none;*/
}

.product-item-action.info-link .fa-object-ungroup.fa-override {
	margin-left: 5px;
}

.product-item-name {
	font-weight: bold;
	font-size: 16px;
	line-height: 100%;
}



/*
@media screen and (max-width: 655px) {
	.product-item-name {
		font-size: 12px;
	}
}
*/

.product-item-description {
	margin-top: 3px;
	font-size: 10px;
	line-height: 12px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

@media screen and (max-width: 1200px) {
	.product-item-description {
		font-size: 12px;
	}
}

.product-item-description img {
	width: 100px;
	height: auto;
	margin-right: 10px;
}
.product-item-price-qtyat {
	font-weight: bold;
	font-size: 11px;
	background-color: #fff;
	border-radius: 4px;
	color: #2BB4D3;
	padding: 5px 5px 3px;
	display: inline-block;
	float: right;
	margin: -2px 0 -5px;
}

.product-item-price-rrp {
	font-weight: bold;
	font-size: 16px;
	background-color: #fff;
	border-radius: 4px;
	color: #2BB4D3;
	padding: 5px 5px 3px;
	display: inline-block;
	float: right;
	margin: -2px 0 -5px;
}

@media screen and (max-width: 480px) {
	.product-item-price-rrp {
		font-size: 12px;
	}
}

.product-item-price-rrp .rrp-label {
	font-size: 10px;
	margin: 0 3px;
}
/*
@media screen and (max-width: 655px) {
	.product-item-price-rrp {
		font-size: 14px;
	}
}
*/
.product-item-explosion {
	margin-left: 5px;
	vertical-align: bottom;
}




@media screen and (min-width: 924px) {
	.product-item {
		flex-basis: 32.8%; /* fits 3 across */
	}
	/*.product-item-image-wrapper, .product-item-image-bg {
		width:25%;
	}
	.product-item-info, .product-item-actions {
		width:75%;
	}*/

}


@media screen and (max-width: 924px) {
	.product-item {
		flex-basis: 48.9%; /* fits 2 across */
	}
}

@media screen and (max-width: 582px) {

	.product-item {
		flex-basis: 100%;
	}
	/*.product-item-image-wrapper,
	.product-item-image-bg {
		width: 18%
	}

	.product-item-info,
	.product-item-actions {
		width:82%
	}*/

}

.searchFormResults-container {
	margin-left: -3px;
	margin-right: -3px;
}

@media screen and (max-width: 1000px) {
	.searchFormResults-container {
		/* shrink down the margins to allow enough space for download buttons */
		margin-left: -13px;
		margin-right: -13px;
	}
}

/* PRODUCT LIST END*/


/*shopping cart icon*/



.icon.shopping-cart {
	position: absolute;
	top: 14px;
	right: 37px;
	z-index: 20;
}

.icon.shopping-cart .fa-override {
	font-size: 40px;
	color: #001A70;
}


.icon.shopping-cart .count {
	background-color: #2BB4D3;
	width: 20px;
	height: 20px;
	color: white;
	font-size: 11px;
	font-weight: bold;
	line-height: 200%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	position: absolute;
	left: 50%;
	top: 0;
	margin-left: -6px;
	text-align: center;
}

.icon.shopping-cart .count.animate {
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	background-color: #2BB4D3;
	width: 35px;
	height: 35px;
	margin-left: -13px;
	top: -8px;
	line-height: 210%;
	font-size: 16px;
}


@media screen and (max-width: 1000px) {
	.icon.shopping-cart {
		top: 26px;
		right: 60px;
		position: fixed;
	}

	.icon.shopping-cart .fa-override {
		font-size: 30px;
		color: #fff;
	}

	.icon.shopping-cart .count {
		top: -2px;
		margin-left: -6px;
		font-size: 10px;
		line-height: 180%;
		width: 18px;
		height: 18px;
	}

	.icon.shopping-cart .count.animate {
		margin-left: -15px;
		top: -10px;
	}
}


/*shopping cart icon end*/

/* other sprite usages that need replacing

.sprite {
	background-image: url(images/sprite.png);
	background-repeat: no-repeat;
}

.sprite.icon {
	width: 42px;
	height: 42px;
	background-position-y: 0;
	display: inline-block;
}

.sprite.icon.white {
	background-position-y: -42px;
}

.sprite.icon.grey {
	background-position-y: -84px;
}

.sprite.icon.red {
	background-position-y: -126px;
}

.sprite.icon.close {
	background-position-x: 0;
}

.sprite.icon.search {
	background-position-x: -42px;
}

.sprite.icon.minus {
	background-position-x: -126px;
}

.sprite.icon.list {
	background-position-x: -168px;
}

.sprite.icon.zoom-in {
	background-position-x: -210px;
}

.sprite.icon.reset {
	background-position-x: -252px;
}

.sprite.icon.zoom-out {
	background-position-x: -294px;
}

.sprite.icon.up {
	background-position-x: -336px;
}

.sprite.icon.down {
	background-position-x: -415px;
}*/


/* Data Tables*/


.data-table {
	width: 100%;
}

.data-table.not-too-wide {
	max-width: 800px;
	margin: 0; /* this prevents the table floating to the center */
}

.data-table td {
	border-bottom: 1px solid #fff;
	font-size: 14px;
	line-height: 140%;
	padding: 2px 4px;
	/*text-align: left; 2020-03-06jn removed - as default anyway*/
	/*white-space: nowrap; mn 2020-05-06 removed, no good on mobile and generally a weird idea */ /* mn 2020-04-11 this a bit weird, not sure if we should remove? if need to put back then add an exception for .freight-special-pricing */
	/*vertical-align: middle;   2020-09-08 mn removed - as default anyway*/
	background-color: #eee;
	background-color: rgba(43,180, 210,0.15);
}

.data-table tr[valign=top] td {
	padding-top: 15px;
	padding-bottom: 15px;
}

.mobileTableWrap .data-table td {
	white-space: nowrap;
}

.data-table td.allow-wrap {
	white-space: normal;
}

.data-table tr.hover-hilight.inactive:hover td,
.data-table tr.hover-hilight:hover td,
.data-table tr.hover-hilight:hover:nth-child(even) td {
	border-bottom-color: #000;
	;
}

.data-table tr:nth-child(even) td {
	background-color: #e6e6e6;
	background-color: rgba(43,180, 210,0.3);
}


.data-table tr.inactive:not(.row-actions) td {
	background-color: #f9f9f9;
	color: #b6b6b6;
}

.data-table tr.inactive a:not(.btn) {
	color: #7e8ead;
}


.data-table.list-table {
	margin-bottom: 20px;
}

.data-table.list-table td {
	padding: 7px;
}

.list-table-filters {
	width: 100%;
	margin-bottom: 10px;
}

.list-table-filters:after {
	clear: both;
	content: "";
	display: table;
}

.list-table-filters .search-field {
	display: inline-block;
	width: auto;
	/*width: calc(100% - 102px);  mn 2021-12-02 removed, hard to work with, auto seems ok */
	text-align: right;
	margin-right: 10px;
	position: relative;
}

.list-table-filters.with-active-filter .CreateNewButton {
	margin-top: 29px;
}

.list-table-filters.with-active-filter .show-deactivated-check-box {
	margin: 0 0 5px 0;
	xfloat: right;
}


.list-table-filters .svyForm.with-standard-search {
	/*width: calc(100% - 150px); mn 2020-04-01 weird hard coding here, needed it bigger for http://localhost/fluidraportal/invoices/list */
	width: calc(100% - 210px);
	text-align: right;
	float: right;
}

.list-table-filters .svyForm.with-standard-search input.svyWideText {
	width: 100%;
	max-width: 500px;
	margin-right: 0;
}

@media screen and (max-width: 600px) {
	.list-table-filters .svyForm.with-standard-search {
		width: 100%;
		float: none;
	}

	.list-table-filters .search-field {
		width: calc(100% - 97px);
		margin-right: 5px;
	}

	.list-table-filters .search-field .savvy-list-search-field {
		width: 100%;
	}

	.list-table-filters.with-active-filter .CreateNewButton,
	.list-table-filters .CreateNewButton {
		margin-top: 5px;
		width: 100%;
	}

	.list-table-filters-left {
		margin-top: 5px;
		width: 100%;
	}

	.list-table-filters.with-active-filter .show-deactivated-check-box {
		float: none;
		text-align: left;
	}


	.list-table-filters {
		margin-bottom: 10px;
	}
}



.data-table.summary-table {
	margin: 10px 0;
}

.data-table.summary-table td {
	border-color: #eee;
	background-color: transparent;
}

.data-table.summary-table tr:nth-child(even) td {
	background-color: transparent;
}

.data-table tr.row-last td,
.data-table tr.row-last:nth-child(even) td {
	background-color: transparent;
}


.data-table a.trk {
	color: #fff;
}

/*
mn 2020-04-01 too general - should use a class 
.data-table .fa-override {
	font-size: 25px;
}
*/

.svySubformRow .remove .fa-times-circle {
	font-size: 14px;
}

.svySubformRow .remove {
	max-width: 17px;
}

.data-table .infoBtn {
	font-size: 25px;
	display: inline-block;
	position: relative;
	top: 6px;
}

.data-table .infoBtn .info-label {
	display: none;
}

.data-table .remove .fa-override {
	color: #a50909;
}


.data-table .info {
	width: 27px;
}

.data-table .actions {
	width: 42px;
	text-align: center;
}

.data-table .actions A IMG {
	border: none;
}

.data-table .tickboxcol {
	width: 25px;
}

.data-table .rightcol {
	border-right: 1px solid #bebebe;
}

.data-table .nopadding {
	padding: 0;
}


.data-table-heading-row .colhead {
	background-color: transparent;
}

th {
	text-align: left;
}

th[align=right] {
	text-align: right;
}

th[align=center] {
	text-align: center;
}

.data-table tr.data-table-heading-row td,
.data-table tr.data-table-heading-row th {
	position: relative;
	background-color: #2BB4D3;
	color: white;
	font-weight: bold;
	padding: 14px 7px;
	/*text-align: left;   mn 2020-04-01 removed, this stops me using align=right */
	line-height: 100%;
	font-size: 14px;
	white-space: nowrap;
}

.data-table tr.data-table-heading-row td a,
.data-table tr.data-table-heading-row th a {
	background: transparent;
	color: white;
}

.data-table tr.data-table-heading-row td a:hover,
.data-table tr.data-table-heading-row th a:hover {
	color: white;
}


.inner-table .data-table tr.data-table-heading-row td,
.inner-table .data-table tr.data-table-heading-row th {
	background-color: #b1b1b1;
	font-size: 12px;
}

.data-table .subform-actions td {
	background-color: transparent;
}

/*
.data-table-heading-row td
.data-table-heading-row th {
	background-color: #001A70;
	color: white;
	font-size: 14px;
}
*/
.data-table th.centre,
.data-table td.centre {
	text-align: center;
}

.data-table th.left,
.data-table td.left {
	text-align: left;
}

.data-table th.right,
.data-table td.right {
	text-align: right;
}

.data-table td:first-child {
	border-left: none;
}

.data-table td:last-child {
	border-right: none;
}

.data-table td.row-actions {
	width: 0;
	white-space: nowrap;
}

.data-table tr:last-child td {
	/* border-bottom:none; */
}


.data-table .totalsRow td {
	border-left: none;
	padding: 5px;
	height: 24px;
	background-color: #fafafa;
	border-top: 1px solid #bebebe;
	border-bottom: 1px solid #bebebe;
	font-weight: bold;
}

.data-table td.subtotalCol {
	font-weight: bold;
	background: url(../images/subtotal-bg.gif) #efefef top right repeat-y;
}

.data-table td.subtotalAmount {
	background-color: #d4d4d4;
	border-right: 1px solid #bebebe;
}

.data-table td.totalCol {
	font-weight: bold;
	color: White;
	background: url(../images/total-bg.gif) #efefef top right repeat-y;
}

.data-table td.totalAmount {
	background-color: #9e9e9e;
	color: White;
	font-weight: bold;
	border-right: 1px solid #bebebe;
}

.data-table .bottomborder TD {
	border-bottom: 1px solid #bebebe;
}

.data-table TD.nobottomborder {
	border-bottom: none;
}

.data-table a.review {
	display: block;
	width: 20px;
	height: 20px;
	background: url(../images/review-icon.gif) 0 0 no-repeat;
	float: left;
}


.data-table-heading-row .colsort {
	padding-right: 14px;
	position: relative;
}


.data-table-heading-row .colsort.selected:after {
	display: block;
	width: 10px;
	height: 10px;
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	border: 5px solid transparent;
}


.data-table-heading-row .colsort.selected.ascending:after {
	border-bottom-color: #fff;
	transform: translateY(-80%);
}

.data-table-heading-row .colsort.selected.descending:after {
	border-top-color: #fff;
	transform: translateY(-20%);
}

.svy-cancel-filter-wrapper {
	/*margin-top: 10px;*/
	display: inline-block;
	position: absolute;
	right: 10px;
	top: 46%;
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.data-table.list-table .colheadfilters td {
	padding-left: 0;
	padding-right: 0;
	border-bottom: none;
}

.colheadfilters form {
	float: right;
}

.colheadfilters td {
	background-color: transparent;
	padding-left: 0;
	margin-left: 0;
}

/* End Data Tables */
/* Data Tables - App Specific */


.data-table .m3pager {
	float: right;
}

.data-table .m3pager A {
	display: block;
	float: left;
}

.data-table .m3pager .m3pager_previous {
	margin-right: 10px;
}

.data-table .productcode {
	white-space: nowrap;
	width: 148px;
	border-left: none;
	text-align: left;
	/*	height: 28px;*/
}

.data-table .productcode INPUT {
	width: 200px;
}

.data-table .supersede {
	width: 10px;
}

@media screen and (max-width: 480px) {
	.data-table td.supersede {
		width: 0 !important;
	}
}

.data-table .quantity {
	width: 25px;
}

.data-table .quantity INPUT {
	width: 60px;
	text-align: center;
}

.data-table .quantityAdjustable {
	width: 40px;
	text-align: center;
}

.data-table .availability {
	width: 30px;
	text-align: center;
}

.data-table .description {
	text-align: left;
}

.data-table .fromlocation {
	text-align: left;
	width: 98px;
}

.data-table .indent {
	width: 10px;
}

.data-table .indentRow td {
	color: #a50909;
}

.data-table .clearance {
	width: 42px;
}

.data-table .rrp {
	text-align: right;
	color: #777777;
	white-space: nowrap;
}

.data-table .unitprice {
	width: 47px;
	text-align: right;
	/*color: #777777;  why grey it out? */
}

/*.data-table .orderpage-discount {
	width: 27px;
}*/
.orderpage-discount {
	cursor: help;
	color: white;
	background: #2BB4D3;
	padding: 2px 5px;
	font-size: 13px;
	white-space: nowrap;
}

.orderpage-discount:hover {
	background: #001A70;
}

.orderpage-custom-product.error{
	background: red;
}

.orderpage-custom-product {
	cursor: help;
	color: white;
	background: #2BB4D3;
	padding: 2px 5px;
	font-size: 13px;
	white-space: nowrap;
	margin-left: 5px;
}

.orderpage-custom-product:hover {
	background: #001A70;
}

.data-table .linetotal {
	width: 47px;
	text-align: right;
}

#totals .grandtotal, #rrptotals .grandtotal {
	text-align: right;
}

.data-table .rrplinetotal {
	text-align: right;
	display: none;
	white-space: nowrap;
}

.data-table .reqdatefield, .data-table .reqdate {
	width: 86px;
	text-align: left;
}

/* End Data Tables - app specific */

/* Account Pages*/

/* End Account Pages*/


/* Manager Pages*/
.show-deactivated-check-box {
	margin: 7px 7px 0 0;
	xfloat: left;
}



/* End Manager Pages*/


.select2-result-label {
	padding: 0;
	font-size: 9pt;
	line-height: 110%;
}

.jq-toast-single ul {
	margin: 0 15px !important;
}

.jq-toast-single ul li.jq-toast-li {
	list-style-type: none !important;
	margin-left: -20px !important;
}

.close-jq-toast-single {
	right: 3px !important;
	border: 2px solid;
	font-size: 16px !important;
	font-weight: bold;
	border-radius: 100%;
	width: 16px;
	height: 16px;
	display: flex;
	justify-content: center;
	align-items: center;
}


.jq-toast-wrap {
	width: 300px !important;
}





@media print {
	.jq-toast-wrap {
		display: none;
	}
}


/* public site overrides */


.public-site .shared-section-wrapper {
	width: 100%;
}

.public-site .shared-section-wrapper .section-content {
	padding-right: 0;
}


.public-site .shared-section-wrapper.page-content {
	padding-left: 0;
	margin: auto;
}

.public-site .container {
	padding: 14px 20px;
	max-width: 660px;
	margin: auto;
}

.flex-horizontal {
	display: flex;
}

.good {
	font-weight: bold;
	color: green;
}

.bad {
	font-weight: bold;
	color: #cc0000;
}

.orange {
	font-weight: bold;
	color: #e66e19;
}


.yesno-Yes {
	font-weight: bold;
	color: green;
}

.yesno-No {
	font-weight: bold;
	color: #cc0000;
}

.sticker {
	font-weight: normal;
	text-transform: uppercase;
	color: white;
	background: #2BB4D3;
	padding: 2px 5px;
	display: inline-block;
	line-height: 100%;
	margin: 1px;
	font-size: 13px;
}

.sticker.good {
	background: green;
	padding: 2px 5px;
	display: inline-block;
	line-height: 100%;
	margin: 1px;
}

.sticker.bad {
	background: #cc0000;
}

.sticker.orange {
	background: #e66e19;
}

.custom-dialog {
	display: none;
}

.custom-dialog .spinner {
	display: none;
	margin-top: 10%;
	text-align: center;
}

.custom-dialog .response {
	display: none;
}


.change-dealer-selector {
	display: none;
}

.profile-current-dealer {
	margin-top: 0px;
	margin-bottom: 10px;
}

.profile-current-dealer-name {
	margin-right: 10px;
}

@media (max-width: 800px) {
	.profile-current-dealer-code {
		display: none;
	}
}

.change-dealer a {
	white-space: nowrap;
}

#df_SubformTable_PaymentAllocation {
	width: 100%;
}

.overdue-red {
	color: red;
	font-weight: bold;
}

.file-link {
	display: block;
	margin-bottom: 10px;
	text-decoration: none;
	padding-left: 18px;
}

.file-link:before {
	content: '\f56d'; /* fa-file-download */
	display: inline-block;
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	font-weight: 800;
	margin-left: -18px;
}

.open-link {
	display: block;
	margin-bottom: 10px;
	text-decoration: none;
	padding-left: 18px;
}

.open-link:before {
	content: '\f35d'; /* fa-external-link-alt */
	display: inline-block;
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	font-weight: 800;
	margin-left: -18px;
}

/* status icons - see also similar (not quite same) in admin.css */

.status-icon {
	padding-left: 22px;
}

.status-icon:before {
	content: ' ';
	display: inline-block;
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	font-weight: 800;
	margin-left: -17px;
}

.status-accepted, .status-in-progress { /* ARA job statuses */
	font-weight: bold;
	color: #2BB4D3;
}

.status-draft {
	font-weight: bold;
	color: #666;
}

.status-new {
	font-weight: bold;
	color: #f15b0f;
}

.status-closed {
	font-weight: bold;
	color: #777;
}

.status-over-time {
	font-weight: bold;
	color: #777;
}

.status-on-hold, .status-awaiting-parts, .status-awaiting-tand-cs, .status-needs-approval {
	font-weight: bold;
	color: orange;
}

.status-awaiting-tand-cs:before {
	content: '\f007'; /* fa-user */
	font-weight: 100;
}

.status-request-approved, .status-approved, .status-actioned, .status-completed, .status-closed, .status-confirmed, .status-checking, .status-reply-received {
	font-weight: bold;
	color: green;
}

.status-reply-received:before,
.status-checking:before,
.status-queried:before {
	content: '\f06e'; /* fa-eye */
	font-weight: 200;
}

.status-draft:before {
	content: '\f044'; /* fa-edit */
	font-weight: 600;
}

.status-new:before {
	content: '\f890'; /* fa-sparkles */
	font-weight: 600;
}

.status-closed:before {
	content: '\f00c'; /* fa-check */
}

.status-over-time:before {
	content: '\f00c'; /* fa-check */
}

.status-request-approved:before, .status-approved:before, .status-actioned:before, .status-completed:before, .status-closed:before, .status-confirmed:before, .status-in-progress:before, .status-accepted:before {
	content: '\f00c'; /* fa-check */
}

.status-declined:before, .status-request-declined:before, .status-cancelled:before, .status-canceled:before, .status-pay-id-expired:before, .status-did-not-finish:before {
	content: '\f00d'; /* fa-times */
}

.status-failed:before, .status-gateway-error:before {
	content: '\f071'; /* fa-exclamation-triangle */
}

.status-submitted:before, .status-queued:before, .status-generating:before, .status-on-hold:before, .status-needs-approval:before, .status-awaiting-parts:before, .status-pay-id-waiting:before, .status-pending:before, .status-offered:before {
	content: '\f017'; /* fa-clock */
}

.status-failed, .status-gateway-error, .status-canceled, .status-pay-id-expired {
	font-weight: bold;
	color: #cc0000;
}

/* payment statuses */
.status-refunded, .status-partial-refunded {
	font-weight: bold;
	color: purple;
}

.status-partial-refunded:before {
	content: '\f0e2'; /* fa-rotate-left */
	font-weight: lighter;
}

.status-refunded:before {
	content: '\f2ea'; /* fa-rotate-left */
	font-weight: bolder;
}

.status-icon.status-offered, .status-icon.status-pay-id-waiting, .status-queried {
	font-weight: bold;
	background-color: orange;
	padding-left: 22px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-weight: normal;
	text-transform: uppercase;
	color: white;
	display: inline-block;
	line-height: 100%;
	margin: 1px;
	font-size: 13px;
	white-space: nowrap;
}

/* end status icons */


/*danger


https://www.web2generators.com/graphism-tools/css-sprite-creator
*/

.danger-icon-number {
	position: relative;
	top: -4px;
	left: -20px;
}


.dg-code-info {
	font-size: smaller;
	margin-left: 10px;
	/*border: 1px solid red;*/
}


#explosive-1, #danger-1 {
	height: 139px;
	width: 140px;
	background: url(images/Dangerous-Goods-labels.png) -163px -9px no-repeat;
}

#gas-2, #danger-2 {
	height: 145px;
	width: 141px;
	background: url(images/Dangerous-Goods-labels.png) -319px -5px no-repeat;
}

#toxic-2, #danger-2b {
	height: 152px;
	width: 142px;
	background: url(images/Dangerous-Goods-labels.png) -476px -0px no-repeat;
}

#poison-2, #danger-2c {
	height: 145px;
	width: 141px;
	background: url(images/Dangerous-Goods-labels.png) -631px -5px no-repeat;
}

#flam-3, #danger-3 {
	height: 143px;
	width: 152px;
	background: url(images/Dangerous-Goods-labels.png) -2px -176px no-repeat;
}

#flam-solid-4, #danger-4 {
	height: 158px;
	width: 137px;
	background: url(images/Dangerous-Goods-labels.png) -164px -164px no-repeat;
}

#combust-4, #danger-4b {
	height: 156px;
	width: 154px;
	background: url(images/Dangerous-Goods-labels.png) -313px -174px no-repeat;
}

#danger-wet-3, #danger-3 {
	height: 160px;
	width: 159px;
	background: url(images/Dangerous-Goods-labels.png) -465px -169px no-repeat;
}

#oxi-5, #danger-5 {
	height: 145px;
	width: 142px;
	background: url(images/Dangerous-Goods-labels.png) -630px -172px no-repeat;
}

#peroxide-5, #danger-5b {
	height: 157px;
	width: 143px;
	background: url(images/Dangerous-Goods-labels.png) -8px -332px no-repeat;
}

#poison-6, #danger-6 {
	height: 153px;
	width: 152px;
	background: url(images/Dangerous-Goods-labels.png) -157px -339px no-repeat;
}

#infectious-6, #danger-6b {
	height: 162px;
	width: 152px;
	background: url(images/Dangerous-Goods-labels.png) -310px -334px no-repeat;
}


#radioactive-9, #danger-9 {
	height: 147px;
	width: 152px;
	background: url(images/Dangerous-Goods-labels.png) -475px -349px no-repeat;
}

#corrosive-8, #danger-8 {
	height: 151px;
	width: 140px;
	background: url(images/Dangerous-Goods-labels.png) -632px -345px no-repeat;
}

#misc-9, #danger-9b {
	height: 75px;
	width: 75px;
	background: url(images/Dangerous-Goods-labels.png) -0px -0px no-repeat;
}

/*danger*/


/* discount popup */
.discount-popup {
	position: absolute;
	top: -160px;
	left: 150px;
	transform: translateY(-300px);
	opacity: 0;
	transition: 0.5s ease-out;
	background-color: #2BB4D3;
	display: none;
	padding: 3px 8px;
	margin: 5px 10px 5px 0;
	border-radius: 3px;
	box-shadow: 2px 2px 4px #00000099;
}

.discount-popup.show-popup {
	transform: translateY(0);
	opacity: 1;
	display: block;
}

.discount-name {
	/*font-weight: bold;*/
	/*xdisplay: inline-block;
	xwidth: 200px;*/
}

.discount-amount {
	/*xdisplay: inline-block;
	xwidth: 100px;*/
	text-align: right;
}


/* end discount popup */

/* last sync panel */
.last-sync-panel {
	font-size: 12px;
	text-align: right;
}

@media (max-width: 801px) {
	.last-sync-panel-right {
		padding-right: 15px;
		/*margin-top: -46px;*/
	}
}

@media (min-width: 800px) {
	.last-sync-panel-right {
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		float: right;
		/*height: 67px;*/
	}
}

/* end last sync panel */
/* input type=number */
/*
.savvy-number-field-wrapper {
	position: relative;
	display: inline-block;
}

.savvy-number-field-wrapper:before,
.savvy-number-field-wrapper:after {
	color: white;
	background-color: #001A70;
	position: absolute;
	right: 12px;
	font-size: 10px;
	pointer-events: none;
	line-height: 100%;
	text-align: center;
	width:16px;
	height:10px;
}

.savvy-number-field-wrapper:hover:before,
.savvy-number-field-wrapper:hover:after {
	background-color: #2BB4D3;
}

.savvy-number-field-wrapper:focus-within:before,
.savvy-number-field-wrapper:focus-within:after {
	display: block;
	background-color: #FFD100;
}


.savvy-number-field-wrapper:before {
	content: "\25B2";
	top:12px;
	padding-top:1px
}

.savvy-number-field-wrapper:after {
	content: "\25BC";
	bottom:18px;
	padding-bottom:1px
}
*/

.savvy-number-field-wrapper {
	position: relative;
	display: inline-block;
	margin-right: 24px;
}

.savvy-number-field-wrapper input[type=text],
.savvy-number-field-wrapper input[type=number] {
	border-right: none;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin: 0;
}


.savvy-number-field-wrapper input[type=number]::-webkit-inner-spin-button,
.savvy-number-field-wrapper input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.savvy-number-field-wrapper input[type='number'] {
	-moz-appearance: textfield;
}



.savvy-number-field-wrapper .quantity-arrow {
	display: block;
	background-color: #001A70;
	width: 25px;
	height: 49%;
	position: absolute;
	right: -24px;
	top: 0;
	cursor: pointer;
	text-align: center;
	color: #fff;
}

.savvy-number-field-wrapper .quantity-arrow.quantity-down {
	top: 51%;
}

.savvy-number-field-wrapper .quantity-arrow.quantity-up:after {
	content: "\25B2";
}

.savvy-number-field-wrapper .quantity-arrow.quantity-down:after {
	content: "\25BC";
}

.savvy-number-field-wrapper .quantity-arrow:hover {
	background-color: #2BB4D3;
}

.savvy-number-field-wrapper .quantity-arrow:active {
	background-color: #FFD100;
}



/*@media screen and (max-width: 480px) {*/
@media screen and (max-width: 1201px) {
	.savvy-number-field-wrapper .quantity-arrow {
		display: none;
		/*top: auto;                 mn 2020-04-10 removed arrows on mobile due to looking weird
		bottom: 0;
		left: 0;
		height: 30px;
		width: 50%;
		line-height: 220%;*/
	}

	.savvy-number-field-wrapper .quantity-arrow.quantity-down {
		display: none;
		/*top: auto;
		right: 0;
		left: auto;
		width: 49%;*/
	}

	.savvy-number-field-wrapper input[type=text],
	.savvy-number-field-wrapper input[type=number] {
		border-right: 1px solid #999;
		/*border-top-right-radius: 6px;
		border-bottom: none;
		border-bottom-left-radius: 0;
		margin-bottom: 30px;*/
	}

	.savvy-number-field-wrapper {
		margin-right: 5px;
	}
}

/* end input type=number */

/* right padding to line up on the right hand side with the last field in a subform, ignoring the x */
.form-right-subform-padding {
	padding-right: 28px;
	float: right;
}

.form-right-subform-padding .number {
	text-align: right;
}

.dash-percentage {
	text-align: center;
	width: 300px;
	/*font-weight: bold;*/
	font-size: 24px;
	margin-top: -25px;
}

.dash-percentage:after {
	font-size: 18px;
	content: "%";
}

/*table.savvy-view-subtable td, table.savvy-view-subtable th {
	padding-right: 20px;
}*/

#dialogDiscounts h3 {
	display: none; /* dont need extra heading when inside the dialog */
}

.margin-top-10 {
	margin-top: 10px;
}

.margin-left-10 {
	margin-left: 10px;
}

.margin-left-20 {
	margin-left: 20px;
}

.margin-left-30 {
	margin-left: 30px;
}

.margin-bottom-10 {
	margin-bottom: 10px;
}

.margin-right-30 {
	margin-right: 30px;
}

.inline-block {
	display: inline-block;
}

.total-rows td {
	background-color: white !important;
	color: black;
	border-bottom: 1px solid #eee;
}

.grand-total-rows td {
	font-weight: bold;
	border-top: 1px solid black !important;
	border-bottom: 1px solid #333;
}

.grandTotal {
	text-align: right;
}

.product-info-name {
	font-size: 18px;
	font-weight: bold;
}


.window-message {
	padding: 9px 14px;
	/*background-color: #001A70;
	color: white;
	*/
	background-color: #FFD100;
	color: black;
	font-size: 16px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	position: relative;
	margin-bottom: 10px;
}

.window-message:last-child {
	margin-bottom: 0;
}

.window-message.notification,
.window-message.newsflash { /* not sure why we need this */
	min-height: 50px;
	padding: 12px 115px 9px 30px;
	position: relative;
}


.window-message > .fa-override {
	position: absolute;
	left: 10px;
	top: 14px;
}

.window-message.newsflash .ok-got-it-btn { /* not sure why we need this */
	position: absolute;
	right: 10px;
	bottom: 10px;
}

.window-message.notification {
	background-color: orange;
}

.m3-unavailable.notification {
	background-color: orange;
}


.window-message.maintenance {
	background-color: red;
	color: white;
}

.window-message.maintenance .maintenance-heading,
.window-message.maintenance .maintenance-heading {
	border-bottom: 1px solid;
	color: #fff;
	font-weight: bold;
	margin-bottom: 5px;
	padding-bottom: 5px;
}

.window-message.maintenance .maintenance-heading .fa-override {
	margin-right: 10px;
}

.window-message.maintenance .endtime {
	font-size: 12pt;
	font-style: italic;
}

.info-panel-danger-icon-wrap {
	margin-left: 20px;
}

.info-panel-danger-icon-wrap .danger-icon-img {
	width: 60px;
}

.product-page-danger-icon-wrap {
	position: absolute;
	margin-top: 70px;
	margin-left: 550px;
}

.product-page-danger-icon-wrap .danger-icon-img {
	width: 100px;
}

.contact-us-cta {
	margin-left: 15px;
}

.info-panel-more {
	position: absolute;
	right: 16px;
	top: 13px;
}


.availability-cell {
	padding-left: 40px !important; /* move over so icon fits */
	padding-right: 10px !important; /* give some space */
}

.availability-cell i {
	font-size: 25px;
	line-height: 35px;
	position: absolute;
	margin-left: -35px;
}

.availability-cell i.fa-times {
	font-size: 25px;
	line-height: 35px;
	position: absolute;
	margin-left: -25px;
}

.availability-cell small {
	display: block;
	color: black;
}


#availabilityPlaceholder small {
	display: inline-block;
	padding-left: 20px;
}

@media screen and (min-width: 800px) and (max-width: 1201px) {
	.availability-cell .avail-label {
		display: none;
	}

	.availability-cell i {
		position: static; /* normal */
		margin-top: -19px;
	}
}

.product-link-item {
	padding-left: 15px;
	padding-top: 7px;
	padding-bottom: 5px;
	display: flex;
}

.product-link-item-thumb {
	width: 100px;
	padding-top: 5px;
	margin-right: 15px;
}

.product-link-item-text {
	width: 100%;
}

.product-link-item-button {
	padding: 10px;
	min-width: 150px;
}

#ui-datepicker-div {
	z-index: 100 !important;
}

.msds-download-panel {
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 10px 20px 20px 20px;
	background: #C6D2EF;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/* to make sure elements like buttons dont hit each other on mobile */
/*@media (max-width: 800px) {*/
.mobile-padded-elements {
	display: flex;
	flex-wrap: wrap;
}

.mobile-padded-elements .btn {
	margin-bottom: 5px;
	margin-top: 5px;
	margin-right: 10px;
}
/*}*/

.no-wrap {
	white-space: nowrap;
}

h3.dash-title {
	text-align: center;
	font-size: 16px;
	color: black;
}

.payment-speedo h3.dash-title {
	display: none;
}

@media (min-width: 800px) {
	.lam-speedo {
		position: absolute;
		margin-left: 400px;
		margin-top: 88px;
	}
}

@media (min-width: 800px) {
	.category-speedo {
		position: absolute;
		margin-left: 400px;
		margin-top: 79px;
		margin-top: 29px;
		z-index: 1;
	}
}

#cboxTitle {
	font-size: 12px;
	line-height: 12px;
	color: black !important;
}

#cboxClose:before {
	content: '\f00d';
	display: inline-block;
	font-family: 'Font Awesome 5 Pro';
	position: absolute;
	font-weight: 800;
	margin-left: -18px;
	font-size: 16px;
}

#cboxClose:hover {
	color: #2BB4D3;
}

.news-article-block {
	display: flex;
}

@media (max-width: 800px) {
	.news-article-block {
		flex-direction: column;
	}
}

.news-pic {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	align-content: center;
}

@media (min-width: 800px) {
	.news-pic {
		margin-right: 20px;
	}
}

.news-pic-img {
	height: 200px;
	width: 300px;
}

@media (max-width: 800px) {
	.news-pic-img {
		height: 200px;
		width: 100%;
	}
}

.news-show-more-btn {
	margin-top: 10px;
}

.news-close-bottom-desktop {
	bottom: 10px;
	position: absolute;
}

@media (max-width: 800px) {
	.news-close-bottom-desktop {
		display: none !important;
	}
}

.news-close-bottom-mobile {
	margin-top: 10px;
	margin-bottom: 20px;
	text-align: center;
}

@media (min-width: 800px) {
	.news-close-bottom-mobile {
		display: none !important;
	}
}

.folded-by-toggle {
	transition: all 1s ease-out;
	opacity: 1;
	position: relative;
	max-height: 9900px;
}

.folded-closed {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	padding-top: 0;
	padding-bottom: 0;
}

.hidden-by-toggle.hidden-closed {
	display: none;
}

.news-pic-big {
	/*height: 400px;
	width: 400px;*/
}



.m3-unavailable {
	display: inline-block;
	background-color: #a50909;
	padding: 10px 12px;
	color: white;
	line-height: 145%;
	font-size: 16px;
	min-height: 45px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	margin-top: 1px;
}

.video-playwrapper {
	position: relative;
}

.video-playbutton {
	position: absolute;
	z-index: 1;
	color: white;
	left: 42px;
	top: 26px;
	font-size: 40px;
}

a:hover .video-playbutton {
	color: #FFD100;
}

/*
fluidra colours
#001A70 fluidra dark blue
#C6D2EF fluidra very light blue
#FFD100 fluidra yellow
#2BB4D3 fluidra sky blue
*/
.svy-ui-dialog {
	font-size: 16px;
}

/*sales force chat button*/
.embeddedServiceHelpButton .helpButton .uiButton {
	background-color: #002060;
	font-family: "Verdana", sans-serif;
}

.embeddedServiceHelpButton .helpButton .uiButton:focus {
	outline: 1px solid #002060;
}

/*sales force chat button end*/

.svyRadioContainer {
	white-space: nowrap;
}

.tracking-links .btn-mini {
	margin-bottom: 5px;
}

.staging-indicator {
	position: absolute;
	top: 10px;
	left: 10px;
}

.special-deal-sticker, .clearance-deal-sticker {
	margin-top: 10px;
}

/* promo tiles */
.promo-tile-container { /* width is 1277 full size */
	display: flex;
	flex-wrap: wrap;
	margin-top: 20px;
	margin-bottom: 20px;
}

.promo-tile .promo-heading {
	height: 55px;
	margin-top: 10px;
}

.promo-tile {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 304px;
	background-color: rgba(43,180, 210,0.15);
	padding: 10px;
	margin-left: 20px;
	border-radius: 3px;
	border: 1px solid rgba(43,180, 210,0.5);
}

.promo-tile:first-child {
	margin-left: 0;
}

.promo-tile .promo-image {
	height: 150px;
}

.promo-actions {
	margin-top: 10px;
	align-self: center;
}

.promo-sticker {
	color: white;
	background: rgba(43,180, 210,0.5);
	margin-left: 10px;
	margin-top: 10px;
	font-weight: bold;
	font-size: 20px;
	padding: 10px;
	border-radius: 23px;
}

.promo-tile-container-horizontal {
	display: block;
	margin-top: 20px;
	margin-bottom: 20px;
}

.promo-tile-horizontal {
	margin-bottom: 10px;
	border-radius: 3px;
	background-color: rgba(43,180, 210,0.15);
	border: 1px solid rgba(43,180, 210,0.5);
	display: flex;
}

.promo-tile-horizontal .promo-image {
	flex-shrink: 0;
	width: 250px;
}

.promo-tile-horizontal-text {
	padding: 20px;
}

/* end promo tiles */

.job-attachment-container {
	box-shadow: 0 2px 4px 0 #d8d4d4;
	width: 100%;
}

.job-attachment-link {
	border: 1px solid #ddd;
	padding: 10px 8px;
	font-size: 14px;
}

.job-attachment-link a {
	margin-right: 8px;
	display: inline-block;
}

.review-table {
	box-shadow: 0 2px 4px 0 #d8d4d4;
	max-width: 650px;
	width: 100%;
}

.comment-content {
	border: 1px solid #ddd;
}

.comment-content td {
	padding: 20px 25px;
}

.send-details {
	color: #001A70;
	font-size: 16px;
	font-weight: bold;
}

.send-details .send-time {
	font-size: 75%;
	opacity: 0.7;
}

.budget-comment-box {
	max-width: 650px;
	width: 100%;
	margin-top: 20px;
}

.budget-comment-box td {
	border: none;
}

.attachment-container {
	margin-top: 10px;
	font-size: 14px;
}

.fw200 {
	padding-right: 20px;
	display: inline-block;
}

@media (min-width: 500px) {
	.fw200 {
		width: 200px;
	}
}

.form-label-right-col {
	font-size: 14px;
	float: right;
}

.not-yet-available {
	color: grey;
	font-size: 14px;
}

.spread {
	display: flex;
	justify-content: space-between;
}

li.form-row .form-field .test-url-btn {
	display: none !important; /* for dealer-locations/edit */
}

/* for fancy radio buttons */
input:disabled + label {
	color: #ccc;
}

.boldface {
	font-weight: bold;
}

input[type="checkbox"].svyCheckBox.svyDisabled + label {
	cursor: not-allowed !important;
}

.flex-horizontal {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.flex-horizontal-item {
	flex-basis: calc(50% - 5px);
	width: unset;
}

.payment-choice-container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	border: 2px solid #2BB4D3;
}

.payment-choice-side {
	position: relative;
	flex-basis: 100%;
}

@media screen and (min-width: 1400px) {
	.payment-choice-side {
		flex-basis: calc(50% - 1px);
	}

	.payment-choice-side:first-child .payment-choice-inner {
		padding-right: 30px;
	}

	.payment-choice-side:last-child .payment-choice-inner {
		padding-left: 40px;
	}
}

.payment-choice-inner {
	padding: 18px;
}


.azupay-widget-iframe {
	height: 800px;
	width: calc(100% - 50px);
}

.azupay-widget-iframe html {
	overflow: hidden !important;
}

.payment-details-item {
	display: flex;
	width: 60%;
	justify-content: space-between;
	margin: 40px 0;
	font-size: 20px;
}

@media screen and (max-width: 1400px) {
	.payment-details-item {
		width: 100%;
	}
}

.payment-value {
	margin-left: 10px;
	font-weight: bold;
}

.payment-option-divider {
	position: relative;
	width: 100%;
	height: auto;
	color: #2BB4D3;
	background-color: white;
	border-bottom: 2px dashed #2BB4D3;
	margin: 30px 0;
}

@media screen and (min-width: 1400px) {
	.payment-option-divider {
		width: 2px;
		height: auto;
		border-left: 2px dashed #2BB4D3;
		border-bottom: 0;
		margin: 0;
	}
}

.payment-option-divider-text {
	position: absolute;
	width: 50px;
	height: 50px;
	border: 2px solid #2BB4D3;
	border-radius: 50%;
	padding: 8px;
	text-align: center;
	font-size: 22px;
	line-height: 134%;
	left: calc(50% - 1px);
	top: 50%;
	transform: translate(-50%,-50%);
	background-color: white;
}

.payment-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.payment-action-icons {
	margin-left: 0;
	margin-top: 20px;
}

@media screen and (min-width: 560px) {
	.payment-actions {
		flex-wrap: nowrap;
	}

	.payment-action-icons {
		margin-left: 20px;
		margin-top: 0;
	}
}

.payment-footnote {
	margin-top: 10px;
	font-size: 18px;
}

.required-star:after {
	content: ' *';
	color: red;
}

.required-star-key {
	float: right;
	margin-top: 7px;
	margin-right: 10px;
	color: black;
}

.required-star-key:before {
	content: '* ';
	color: red;
}


.promo-icon-sticker {
	margin-top: 7px;
	text-transform: uppercase;
	background: #2BB4D3;
	cursor: help;
	padding: 5px;
}

.promo-icon-sticker a {
	color: white;
	text-decoration: none;
}

.promo-icon-sticker:hover {
	background: #001A70;
	xoutline: 1px solid #001A70;
}

.promo-icon-sticker:hover a {
	color: white;
	text-decoration: none;
}


.promoIcon {
	display: block;
	text-transform: uppercase;
	color: white;
	background: #2BB4D3;
	cursor: help;
	padding: 1px 5px 1px 5px;
}

.promo-offer-info-panel-details {
	background: #2BB4D3;
	color: white;
	padding: 3px;
	text-transform: uppercase;
	padding: 1px 5px 1px 5px;
}

.topborder {
	border-top: 1px solid #ccc;
}

.message-box.promo-message-yellow {
	background-color: #FFD100;
	color: black;
}

.message-box.promo-message-orange {
	background-color: orange;
	color: black;
}

.message-box.promo-message-red {
	background-color: #cc0000;
	color: white;
}

.message-box.promo-message-green {
	background-color: #3cbb40;
	color: white;
}

.message-box .btn-mini {
	margin-left: 20px;
}
/*.promo-message a {
	color: white;
}
.promo-message a:hover {
	color: #001A70;
}*/

/* jquery ui-accordion - used for OrderPackage.aspx panel */
.ui-accordion-content {
	padding: 5px 0 !important;
	border: none !important;
}

.ui-accordion-header {
	font-size: 18px !important;
}

.promo-terms {
	font-size: 14px;
	line-height: 130%;
	margin-top: 10px;
}

.show-mobile-only {
	display: none !important;
}

@media screen and (max-width: 480px) {
	.asset-product-list .data-table-heading-row {
		display: none;
	}

	.show-mobile-only {
		display: block !important;
	}

	.product-col {
		display: flex;
	}
}

.promo-tc-apply {
}


@keyframes shadowPulse {
	0% {
		box-shadow: 0px 0px 19px 14px rgb(255 224 0);
	}

	100% {
		box-shadow: 0px 0px 0px 0px rgb(255 224 0);
	}
}

.shadow-pulse {
	animation-name: shadowPulse;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-timing-function: linear;
}

.shadow-pulse-3 {
	animation-name: shadowPulse;
	animation-duration: 1s;
	animation-iteration-count: 3;
	animation-timing-function: linear;
}

.savvy-dictionary-table {
	margin-top:0;
}

td.savvy-dictionary-label {
	padding: 5px 15px !important;
}
td.savvy-dictionary-field {
	font-weight: bold;
	padding: 5px 15px !important;
}
