/*! jQuery UI - v1.12.1 - 2016-09-14 - etail path updated
* http://jqueryui.com
* Includes: core.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, draggable.css, resizable.css, progressbar.css, selectable.css, selectmenu.css, slider.css, sortable.css, spinner.css, tabs.css, tooltip.css, theme.css
* Copyright jQuery Foundation and other contributors; Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
	z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}


/* Icons
----------------------------------*/
.ui-icon {
	display: inline-block;
	vertical-align: middle;
	margin-top: -.25em;
	position: relative;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}

.ui-widget-icon-block {
	left: 50%;
	margin-left: -8px;
	display: block;
}

/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin: 2px 0 0 0;
	padding: .5em .5em .5em .7em;
	font-size: 100%;
}
.ui-accordion .ui-accordion-content {
	padding: 1em 2.2em;
	border-top: 0;
	overflow: auto;
}
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
.ui-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: block;
	outline: 0;
}
.ui-menu .ui-menu {
	position: absolute;
}
.ui-menu .ui-menu-item {
	margin: 0;
	cursor: pointer;
	/* support: IE10, see #8844 */
	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}
.ui-menu .ui-menu-item-wrapper {
	position: relative;
	padding: 3px 1em 3px .4em;
}
.ui-menu .ui-menu-divider {
	margin: 5px 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: -1px;
}

/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item-wrapper {
	padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: .2em;
	margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
	left: auto;
	right: 0;
}
.ui-button {
	padding: .4em 1em;
	display: inline-block;
	position: relative;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;

	/* Support: IE <= 11 */
	overflow: visible;
}

.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}

/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2em;
	box-sizing: border-box;
	text-indent: -9999px;
	white-space: nowrap;
}

/* no icon support for input elements */
input.ui-button.ui-button-icon-only {
	text-indent: 0;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -8px;
	margin-left: -8px;
}

.ui-button.ui-icon-notext .ui-icon {
	padding: 0;
	width: 2.1em;
	height: 2.1em;
	text-indent: -9999px;
	white-space: nowrap;

}

input.ui-button.ui-icon-notext .ui-icon {
	width: auto;
	height: auto;
	text-indent: 0;
	white-space: normal;
	padding: .4em 1em;
}

/* workarounds */
/* Support: Firefox 5 - 40 */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-controlgroup {
	vertical-align: middle;
	display: inline-block;
}
.ui-controlgroup > .ui-controlgroup-item {
	float: left;
	margin-left: 0;
	margin-right: 0;
}
.ui-controlgroup > .ui-controlgroup-item:focus,
.ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
	z-index: 9999;
}
.ui-controlgroup-vertical > .ui-controlgroup-item {
	display: block;
	float: none;
	width: 100%;
	margin-top: 0;
	margin-bottom: 0;
	text-align: left;
}
.ui-controlgroup-vertical .ui-controlgroup-item {
	box-sizing: border-box;
}
.ui-controlgroup .ui-controlgroup-label {
	padding: .4em 1em;
}
.ui-controlgroup .ui-controlgroup-label span {
	font-size: 80%;
}
.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
	border-left: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item {
	border-top: none;
}
.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
	border-right: none;
}
.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
	border-bottom: none;
}

/* Spinner specific style fixes */
.ui-controlgroup-vertical .ui-spinner-input {

	/* Support: IE8 only, Android < 4.4 only */
	width: 75%;
	width: calc( 100% - 2.4em );
}
.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
	border-top-style: solid;
}

.ui-checkboxradio-label .ui-icon-background {
	box-shadow: inset 1px 1px 1px #ccc;
	border-radius: .12em;
	border: none;
}
.ui-checkboxradio-radio-label .ui-icon-background {
	width: 16px;
	height: 16px;
	border-radius: 1em;
	overflow: visible;
	border: none;
}
.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
	background-image: none;
	width: 8px;
	height: 8px;
	border-width: 4px;
	border-style: solid;
}
.ui-checkboxradio-disabled {
}
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}

/* Icons */
.ui-datepicker .ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
	left: .5em;
	top: .3em;
}
.ui-dialog {
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .4em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-n {
	height: 2px;
	top: 0;
}
.ui-dialog .ui-resizable-e {
	width: 2px;
	right: 0;
}
.ui-dialog .ui-resizable-s {
	height: 2px;
	bottom: 0;
}
.ui-dialog .ui-resizable-w {
	width: 2px;
	left: 0;
}
.ui-dialog .ui-resizable-se,
.ui-dialog .ui-resizable-sw,
.ui-dialog .ui-resizable-ne,
.ui-dialog .ui-resizable-nw {
	width: 7px;
	height: 7px;
}
.ui-dialog .ui-resizable-se {
	right: 0;
	bottom: 0;
}
.ui-dialog .ui-resizable-sw {
	left: 0;
	bottom: 0;
}
.ui-dialog .ui-resizable-ne {
	right: 0;
	top: 0;
}
.ui-dialog .ui-resizable-nw {
	left: 0;
	top: 0;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-draggable-handle {
}
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
	height: 100%;
	filter: alpha(opacity=25); /* support: IE8 */
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
.ui-selectable {
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
.ui-selectmenu-menu {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.ui-selectmenu-menu .ui-menu {
	overflow: auto;
	overflow-x: hidden;
	padding-bottom: 1px;
}
.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.5;
	padding: 2px 0.4em;
	margin: 0.5em 0 0 0;
	height: auto;
	border: 0;
}
.ui-selectmenu-open {
	display: block;
}
.ui-selectmenu-text {
	display: block;
	margin-right: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-selectmenu-button.ui-button {
	text-align: left;
	white-space: nowrap;
	width: 14em;
}
.ui-selectmenu-icon.ui-icon {
	float: right;
	margin-top: 0;
}
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: default;
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
	filter: inherit;
}

.ui-slider-horizontal {
	height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}

.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
.ui-sortable-handle {
}
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: .222em 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: .4em;
	margin-right: 2em;
}
.ui-spinner-button {
	width: 1.6em;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
	border-top-style: none;
	border-bottom-style: none;
	border-right-style: none;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}
.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
	padding: .2em;
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 1px .2em 0 0;
	border-bottom-width: 0;
	padding: 0;
	white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	float: left;
	padding: .5em 1em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px;
	padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
	cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
	cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding: 1em 1.4em;
	background: none;
}
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
}
body .ui-tooltip {
	border-width: 2px;
}

/* Component containers
----------------------------------*/
.ui-widget {
	font-family: inherit;
	font-size: 1em;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: inherit;
	font-size: 1em;
}
.ui-widget.ui-widget-content {
	border: 1px solid #c5c5c5;
}
.ui-widget-content {
	border: 1px solid #dddddd;
	background: #ffffff;
	color: #333333;
}
.ui-widget-content a {
	color: #333333;
}
.ui-widget-header {
	border: 1px solid #dddddd;
	background: #e9e9e9;
	color: #333333;
	font-weight: bold;
}
.ui-widget-header a {
	color: #333333;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,

/* We use html here because we need a greater specificity to make sure disabled
works properly when clicked or hovered */
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	border: 1px solid #c5c5c5;
	background: #f6f6f6;
	font-weight: normal;
	color: #454545;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
	color: #454545;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	border: 1px solid #cccccc;
	background: #ededed;
	font-weight: normal;
	color: #2b2b2b;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus {
	color: #2b2b2b;
	text-decoration: none;
}

.ui-visual-focus {
	box-shadow: 0 0 3px 1px rgb(94, 158, 214);
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border: 1px solid #003eff;
	background: #007fff;
	font-weight: normal;
	color: #ffffff;
}
.ui-icon-background,
.ui-state-active .ui-icon-background {
	border: #003eff;
	background-color: #ffffff;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #ffffff;
	text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid #dad55e;
	background: #fffa90;
	color: #777620;
}
.ui-state-checked {
	border: 1px solid #dad55e;
	background: #fffa90;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #777620;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid #f1a899;
	background: #fddfdf;
	color: #5f3f3f;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #5f3f3f;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #5f3f3f;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: .7;
	filter:Alpha(Opacity=70); /* support: IE8 */
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: .35;
	filter:Alpha(Opacity=35); /* support: IE8 */
	background-image: none;
}
.ui-state-disabled .ui-icon {
	filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	width: 16px;
	height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_444444_256x240.png");
}
.ui-widget-header .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_444444_256x240.png");
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_555555_256x240.png");
}
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_ffffff_256x240.png");
}
.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon {
	background-image: url("/images/jqueryui/ui-icons_777620_256x240.png");
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_cc0000_256x240.png");
}
.ui-button .ui-icon {
	background-image: url("/images/jqueryui/ui-icons_777777_256x240.png");
}

/* positioning */
.ui-icon-blank { background-position: 16px 16px; }
.ui-icon-caret-1-n { background-position: 0 0; }
.ui-icon-caret-1-ne { background-position: -16px 0; }
.ui-icon-caret-1-e { background-position: -32px 0; }
.ui-icon-caret-1-se { background-position: -48px 0; }
.ui-icon-caret-1-s { background-position: -65px 0; }
.ui-icon-caret-1-sw { background-position: -80px 0; }
.ui-icon-caret-1-w { background-position: -96px 0; }
.ui-icon-caret-1-nw { background-position: -112px 0; }
.ui-icon-caret-2-n-s { background-position: -128px 0; }
.ui-icon-caret-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -65px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -65px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 1px -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 3px;
}

/* Overlays */
.ui-widget-overlay {
	background: #000;
	opacity: .5;
	filter: Alpha(Opacity=.3); /* support: IE8 */
}
.ui-widget-shadow {
	-webkit-box-shadow: 0px 0px 5px #666666;
	box-shadow: 0px 0px 5px #666666;
}
/**
 * Owl Carousel v2.2.1 
 * THIS IS A BASE FILE - overrides should be in sitepanes.css in the relevant place!
 * 
 * 
 * 
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */
/*
 *  Owl Carousel - Core
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1; }
  .owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    -moz-backface-visibility: hidden;
    /* fix firefox animation glitch */ }
  .owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px); }
  .owl-carousel .owl-wrapper,
  .owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0); }
  .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; }
  .owl-carousel .owl-item img {
    display: block;
    width: 100%; }
  .owl-carousel .owl-nav.disabled,
  .owl-carousel .owl-dots.disabled {
    display: none; }
  .owl-carousel .owl-nav .owl-prev,
  .owl-carousel .owl-nav .owl-next,
  .owl-carousel .owl-dot {
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-loaded {
    display: block; }
  .owl-carousel.owl-loading {
    opacity: 0;
    display: block; }
  .owl-carousel.owl-hidden {
    opacity: 0; }
  .owl-carousel.owl-refresh .owl-item {
    visibility: hidden; }
  .owl-carousel.owl-drag .owl-item {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-grab {
    cursor: move;
    cursor: grab; }
  .owl-carousel.owl-rtl {
    direction: rtl; }
  .owl-carousel.owl-rtl .owl-item {
    float: right; }

/* No Js */
.no-js .owl-carousel {
  display: block; }

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both; }

.owl-carousel .owl-animated-in {
  z-index: 0; }

.owl-carousel .owl-animated-out {
  z-index: 1; }

.owl-carousel .fadeOut {
  animation-name: fadeOut; }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/*
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out; }

/*
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 400ms ease; }

.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d; }

/*
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000; }

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease; }

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
      transform: scale(1.3, 1.3); }

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none; }

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease; }

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%; }
/* ------------------------------------------------------------------------------------
        SCREEN - Doors and Fittings 2019    
        3768320 : 4816896
        Filename : sitepanes.css
        Last Updated : 28. 06. 2019
        Copyright : (c) 2017 Etail Systems Ltd
        Author : Etail Systems Ltd
        Web : http://www.etailsystems.com

	Table of Contents
		01. =Reset
		02. =Page
		03. =Typography
		04. =Buttons
		05. =Tables
		06. =Forms
		07. =PanelTop
		08. =Breadcrumb
		09. =CenterPanel
		10. =MainPanel
		11. =RightPanel
		12. =LeftPanel
		13. =FooterPanel
		14. =BottomPanel
		15. =FilterSearch
		16. =SearchHeader / SearchFooter 
		17. =DepartmentTree
		18. =FeaturedProducts
		19. =RecentItems
		20. =ProductLists
		21. =HoverBsket
		22. =PopupDialog / Popup Add to Basket
		23. =Basket
		24. =Checkout process
		25. =Sitemap
		26. =Messages
		27. =AutoComplete
		28. =QuickView
		29. =CustomPromotions
		30. =CustomArticles
		31. =AccordionArticles
		31. =Blog
		32. =OwlCarousel/Jquery Base
		33. =Jquery Base Overrides
		34. =Hacks
		
		Colors Used;
		Dark-Grey #605e5e 
		light-Grey #eeecec
		AlmostBlack #0d0d0d
		Offer/Alert-Red #a1c327

		#f3f4f6 - top line, image background
		#eeeff0
		#cac9c9
		#8d8d99 - dark border / nav /  footer
		#4d4f52 - dark text heading
		#d8e3e9 - footer alt text
		#a1c327 - actions



=Definitions
------------------------------------------------------------------------------------- */
:root {
	--mainColor:#757477;
	--altColor:#d0a55d;
	--altColor2:#A0A09F;

	--textColor:#4d4f52;
	--textColorLight:#d8e3e9;

	--textHeadingColor:#757477;
	--textHeadingAltColor:#A0A09F;

	--textSubHeadingColor:rgb(174,186,195);

	--bgColor:#f3f4f6;
	--bgaltColor:#eeeff0;;
	--bgaltColorAlpha:rgb(160 160 159 / .8);
	--bgaltColor2:#cac9c9;

	--footerColor:#e8e8e8;

	--checkoutButtons:#a1c327;

	--white:#ffffff;

	--mainFont:'Frutiger LT Std 67',sans-serif;
	--mainFontBold:'Frutiger LT Std 67 Bold', sans-serif;
	--altFont:'Frutiger LT Std 67 Bold Condensed',sans-serif;
	--altFont2:"open-sans", sans-serif;
}

	
/* =Reset 
------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, 
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, 
q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, 
form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    -webkit-font-smoothing: antialiased;
    /* Looks pretty much the same than Windows */
}

/* To enable HTML5 elements in IE */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
    display: block;
}


/* -----------------------------------------------------------------------------------------------------------------
=Page 
------------------------------------------------------------------------------------- */

html, body {
    width: 100%;
    min-width: 1200px;
    /* max-width:1920px; */
    color:#605e5d;
    margin-left: auto;
    margin-right: auto;
    /*because iPad*/
}

body {
    font-size: 100%;
    line-height: 1;
}

#cont {
    margin-left: auto;
    margin-right: auto;
}

/* -------------------------------------------------------------------------------------
=Typography 
------------------------------------------------------------------------------------- */

/* latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v14/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), url(https://fonts.gstatic.com/s/opensans/v14/MTP_ySUJH_bn48VBG8sNSugdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* this choice of font-family is supposed to render text the same across platforms */
body, input, button, textarea, select {
    font-family: 'Open Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    /* Looks pretty much the same than Windows */
}

p, li, label, input, select, textarea {}

select, textarea {
    padding:.5em;
}

input.inputtext,
input.inputtext_light /*used for the newsletter signup */{
    padding:0 .5em;
    font-size:1em;
    padding:.5em;
    border:1px #735e5d  solid;
    color:#735e5d;
}


/* Headings
------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{
	font-family: 'Open Sans', sans-serif;
    margin-bottom: .5em;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.8em;
}

h3 {
    font-size: 1.5em;
}

h4 {
    font-size: 1.4em;
}

h5 {
    font-size: 1.2em;
}

h6 {
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
    font-size: 1em;
}


/* Links
------------------------------------------------------- */
a{
     /* float: left; don't use a float at this level it breaks normal layout */
     text-decoration: none;
     color:inherit; /*makes the link the same colour as whatever the thing is that its in h3 h4 p etc*/
}

a:hover{}
a:active{}

a:visited{
    text-decoration: none;
}

/* Specific headings
------------------------------------------------------- */


/* Base Typography
------------------------------------------------------- */

p, ol, ul, dl, address {
    font-family: 'Open Sans', sans-serif;
    font-size: 1em;
    font-weight: 400;
}

b, strong {
    font-weight: bold;
    font-size:inherit;
}

ol, ul {
    list-style: none;
}

li ul, li ol {
    font-size: 1em;
    margin: 0.825em 0;
}

abbr {
    opacity: 0.9;
}

abbr[title]:hover, dfn[title] {
    cursor: help;
}

ins, mark {
    padding: 0 0.125em;
    text-decoration: none;
}

sub, sup {
    position: relative;
    font-size: smaller;
    line-height: 0;
}

sup {
    vertical-align: super;
}

sub {
    vertical-align: sub;
}

del, s {
    font-weight: 400;
    margin-right: 5px;
    text-decoration: line-through;
}

/* Article typesettings 
------------------------------------------------------- */

#pm .art h2,
#pm .art h3,
#pm .art h4,
#pm .art h5 {
}

#pm .artp p {
	line-height:1.5;
    margin-bottom:.5em;
}

#pm .artp  p + h2,
#pm .artp  p + h3,
#pm .artp  p + h4,
#pm .artp ul + h2,
#pm .artp ul + h3,
#pm .artp ul + h4{
    margin-top:1.5em;
}

#pm .artp ul {
	list-style:disc;
    margin-left:2em;
    margin-top:1em;
    margin-bottom:1em;
}

#pm .artp ol {
	list-style:decimal;
}
#pm .artp ul li{
	margin-bottom:.5em;
	line-height:normal;
}

#pm .artp img {}
#pm .artp a {
	font-weight:600;
	color:#49708a;
}

#pm .artp a.btn{
    font-weight:normal;
    color:#fff;
}

#pm .artp a:hover {
    text-decoration:underline;
}

#pm .artp a.btn:hover {
    text-decoration:none;
}

#pm .art .artp table{
    border-collapse: collapse;
    margin-bottom:1em;
}

#pm .art .artp table th{
    font-size:1.5em;
    padding:.25em;
}

#pm .art .artp table th:first-child{
    width:40%;
}

#pm .art .artp table tr:nth-child(odd){}

/*banner fixes - ensures nothing is too big for the site but all images should be sized appropriately anyway before uploading to COMS */
.bnr a{
	display:block;
}

#pm .pbnr .bnr img{
	max-width:100%;
	height:auto;
	display:block;
}

#pm .art +hr{
	/*bit of a hack*/
	display:none;
}


blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C" "\201D";
}

blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}

blockquote p {
  display: inline;
}

/* -------------------------------------------------------------------------------------
=Buttons 
------------------------------------------------------------------------------------- */

.submit,
a.btn {
    font-weight:600;
    font-size:1em;
    padding:.5em 1em;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:.5em;
    color:#fff;
    border:1px #a1c327 solid;
    background-color:#a1c327;
}

.submit:hover,
a.btn:hover{
	/* color:#a1c327; */
	/* background-color:transparent; */
}

li a.btn{
	display:inline-block;
}

a.btn {
    padding: .5em;
}

td a.btn{
    display:block;
}

a.btn:hover {
    text-decoration: none;
}

.submit:hover,
a.btn:hover {}


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


/* Defaults for tables 
------------------------------------------------------- */

table {
    width: 100%;
    font-size: 1em;
}

table tr.header th {
    font-size: 1em;
    text-transform: uppercase;
    padding: .5em;
    background-color:#f3f4f6;
    color:#3d4146;
}

table tr td {
    padding: .5em;
    vertical-align: middle;
}

/* Delivery Information
------------------------------------------------------- */

#pm .art.deliveryInfo h3 {}
#pm .art.deliveryInfo h4, #pm .art.deliveryInfo table {}
.deliveryInfo table {}
.deliveryInfo table th {}
.deliveryInfo table td {}
#pm .deliveryInfo .artp table td p {}


/* -------------------------------------------------------------------------------------
=Forms
------------------------------------------------------------------------------------- */
/* Defaults
------------------------------------------------------- */
.form {}

.form .bt {}

.form .bt h3 {
	padding: .5em 0;
}
.form h5,
.form h5,
.form h5 {}

.form li select,
.form li textarea,
.form li input {
}

.form li {
	/* try grid layout */
	display:grid;
	grid-template-columns: minmax(auto, 2fr) 3fr;
	grid-gap:.25em;
	margin-bottom:.5em;
	align-items:start;
}

.form li.reqmsg{
	grid-template-columns:1fr;
	text-align:right;
	color:red;
}

.form li.header{
	margin-bottom:1.5em;
}

.form label {
	font-weight:bolder;
}

.form label img {
	display:inline-block;
}

.form li.help,
.form li.info {
	display:inline-block;
	font-size:.825em;
	/* font-weight:bolder; */
}

.form form {}

/*headings? */
.form li h3 {
	grid-column:1/-1;
	font-size:1em;
}

.form ul.radio {}
.form ul.radio li {}

.form form .submit {
	/* text-align:right; */
	/* margin-left:auto; */
	display:block;
}

/* captcha */
.form .g-recaptcha{
	grid-column:2;
	text-align:right;
	display:block;
	margin-left:auto;
}

/* fix for checklists*/
.form li ul.check {
    /* outline:1px red solid; */
}

.form li ul.check li{
    display:inline-block;
}

.form li input.chkbox{
	width:auto;
	display:inline-block;
}

/* Sign In
------------------------------------------------------- */
.form#psign{
	width:50%;
	margin:auto;
}

/* as labels aren't being used - placeholders are */
.form#psign select,
.form#psign textarea,
.form#psign input {
	width:calc(100% - 1em);
}

.form#psign .exstreqsubmit input.submit{
	grid-column:1;
	justify-self:start;
	width:auto;
	margin-left:0;
}

.form#psign .exstfgtpwd {
	display:block;
	font-weight:400;
}

.form#psign .exstreglnk{
	display:inline-block;
}


.form#psign .exstreglnk .registerlink{
	display:block;
}

.form#psign .exstreglnk h5{
	font-weight:400;
}

.form#psign .exstreglnk h5 a{
	text-decoration:underline;
	text-decoration-color: #a1c327;
}

/* Register
------------------------------------------------------- */
.form#preg{
	width:50%;
	margin:auto;
}

/* as labels aren't being used - placeholders are */
.form#preg select,
.form#preg textarea,
.form#preg input {
	/* would rather not have to do this, but we display the width on the input element and that borks things */
	width:calc(100% - 1em);
}

.form#preg input.submit{
	grid-column:1/-1;
	margin:auto;
	width:auto;
	padding:.5em 1.5em;
}
.form#preg .subscribe label{
	grid-column:1;
	grid-row:1;

}
.form#preg .subscribe input.chkbox{
	width:auto;
	display:inline-block;
	grid-column:2;
	grid-row:1;
}

/* Forgotten Password
------------------------------------------------------- */
.form#pwrem{}

/* Checkout (New Customer)
------------------------------------------------------- */
.form#pchkoutnewcust{}

/* Checkout (Sign In)
------------------------------------------------------- */
.checkoutsignin #pm .form#psign,
.checkoutsignin #pm .form#pchkoutnewcust {
}

/*existing customer pane */
.checkoutsignin #pm .form#psign ul.exstcust {}
.checkoutsignin #pm .form#psign ul.exstcust label {}
.checkoutsignin #pm .form#psign .exstnotme a {
}

/* -------------------------------------------------------------------------------------
=FIXEDPanels (top and bottom)
------------------------------------------------------------------------------------- */

#ptf{
    top:0px;
    z-index:2002;
    width: 100%;
    min-width: 1200px;
    float: left;
    background-color:#f3f4f6;
    color:#3d4146;
    margin-bottom: 2em;
}

#ptf .ext {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    /* text-align:right; */
    display:grid;
    grid-template-columns: auto auto auto ;
}

/* top strapline
------------------------------------------------------- */
#ptf .ext .art.topStrapline{
	/* float:left; */
	/* padding:1em 0; */
	font-size:.9em;
	font-size:.813em;
	display:none;
	}

#ptf .ext .art.topStrapline h2{
	font-size:1em;
	margin:0;
}

#ptf .info{
	/* float:right; */
	display:inline-block;
	vertical-align:middle;
	text-align:center;
}

#ptf .info li{
	display:inline-block;
	font-size:.813em;
	padding:0 .5em;
	text-transform:uppercase;

}

#ptf .info li a{
	display:inline-block;
	padding: 0.5em 0;
}

#ptf .info li a:hover{
	text-decoration:underline;
	text-decoration-color:#a1c327 ;
}

/* Top Signin/Register
------------------------------------------------------- */

#ptf .info li a[title="Sign in"]{
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/sign%20in%20icon.png') no-repeat left 1em center;
	padding-left:3em;
	background-size:1em;
	border-left:1px #d8d9db solid;
}

/******
top myaccount nav
***********/
#ptf .cust {
	float:right;
	background: url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/sign%20in%20icon.png') no-repeat left 0em center;
	/* padding-left: 0.5em; */
	/* border-left:1px #d8d9db solid; */
	font-size:.813em;
}

#ptf .cust ul.topnav{
	/* padding:1em 0; */
}

#ptf .cust h4,
#ptf .cust h4 a{
	margin-bottom:0;
	color: #3d4146;
	font-weight: 400;
	font-size: 1em;
	cursor: pointer;
	text-transform:uppercase;
	padding: .5em 1em;
}

/*first set the typography*/
.cust ul.topnav li a,
.cust li a {
    font-weight: 400;
    font-size: 1em;
}

.cust ul.topnav li a:hover,
.cust li a:hover{
	text-decoration:underline;
	text-decoration-color:#a1c327 ;
}



/*to show the sub menu */
.cust ul li.acct:hover ul.subnav{
    display: block;
}

.cust ul.subnav {
    position: absolute;
    margin:auto;
    /* right:0px; */
    top: 2em;
    display: none;
    width: 135px;
    padding: 0;
    z-index: 10000;
    -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    /* outline:1px red solid; */
    background-color:#f3f4f6;
    text-align:left;
}

.cust ul.subnav li{
	margin:.5em 1em;
}

.cust ul.subnav li a{
	width:100%;
	display:inline-block;
}

	
/* vat switch
------------------------------------------------------- */
#ptf .vatsw{
	display:inline-block;
	vertical-align:middle;
	text-transform:uppercase;
    text-align:right;
	font-size:.813em;
}

.vatsw div{
	display:inline-block;
	vertical-align:middle;
	font-size:inherit;
}

.vatsw form#vatswitch{
	position: relative;
	margin: 0 auto;
}

.vatsw form input label{
	text-shadow: 0 1px rgba(255, 255, 255, 0.25);
}

.vatsw form input {
	display:inline-block;
	vertical-align:middle;

    width: 1em;
    height: 1em;
	margin:.5em 0;
    background-color: #bfbfbf;
    -webkit-appearance: none;
    cursor:pointer;
}

.vatsw form input[checked="checked"] {
    background-color:#a1c327;
    background-repeat: no-repeat;
    cursor:initial;
}

#vatswitch div:nth-child(1) label {
	float: left;
	margin: .5em;
	border-radius: .25em 0 0 .25em;
}

#vat_yes {
   	display:inline-block;
    vertical-align:middle;
    border-radius: .25em 0 0 .25em;
    border-top: 1px solid #bfbfbf;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #bfbfbf;
}

#vat_no {
	display:inline-block;
	vertical-align:middle;
    border-radius: 0 .25em .25em 0;
    border-top: 1px solid #bfbfbf;
    border-right: 1px solid #bfbfbf;
    border-bottom: 1px solid #fff;
}

#vatswitch div:nth-child(2) label {
    float: right;
    margin:.5em;
    margin-left: .5em;
}


#ptf .art {
	grid-column:1/-1;
	padding:.5em;
	font-size:.825em;
}




















#pbf{
 	float: left;
 	width:100%;
    background:#8d8d99;

}

#pbf .ext {
	width: 1200px;
	margin: 0 auto;
	position: relative;
	font-size:.8em;
	padding:1em 0;
	color:#cacaca;
	border-top: 1px #cacaca solid;
	margin-bottom:1em;
}

#pbf a{
	color:#a1c327;
}
#pbf a:hover{
	text-decoration:underline;
}

#pbf .pbnr{
    display:inline-block;
    width:50%;
    text-align:right;
}

#pbf .pbnr .bnr{
	display:inline-block;
	font-size:1.2em;
	margin:0 .5em;
}

#pbf .pbnr .bnr img{
	width:1em;
	height:auto;
}

#pbf .info ul{
	width:100%;
	text-align:center;
}

#pbf .info li{
	color:#fff;
	display:inline-block;
	margin:0 1em;
}

#pbf .info li a{
	color:inherit;
}



#pbf .art{
	margin-top:.5em;
}

#a76349440{
display:inline-block;
width:50%;

}

#a76349440 li{
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;
}

#a142540800{
	text-align:right;
	display:inline-block;
	width:50%;
}

#a142540800 li{
	font-size:16px;
	display:inline-block;
	text-align:right;
	margin-left:10px;
}
#a142540800 .fa-apple-pay,
#a142540800 .fa-google-pay{
	font-size:18px;
}

#pbf #a142540800 a{
	color:#fff;;
}
/* -------------------------------------------------------------------------------------
=SiteContainer
------------------------------------------------------------------------------------- */
#site{}

/* -------------------------------------------------------------------------------------
=PanelTop 
------------------------------------------------------------------------------------- */

#pt {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    min-width: 1200px;
    float: left;
    background:linear-gradient(to top, #8d8d99 0, #8d8d99 54px,  transparent 54px, transparent 100% );

}
#pt .ext {
    width: 1200px;
    margin: 0em auto;
    position: relative;
}

#pt ul {
    /* typically we dont want bullet styles*/
    list-style: none;
    list-style-position: inside;
    display: inline;
}

/* Site Logo
------------------------------------------------------- */

#pt .pbnr{
	text-align:center;
	display:inline-block;
	vertical-align:middle;
	margin:0 1em;
	margin-bottom:2em;
}

#pt .pbnr p{
	font-family: 'Playfair Display', serif;
	text-transform:lowercase;
	font-style:italic;
	font-size:1.2em;
	color:#9b9b9b
}


/* top contact
------------------------------------------------------- */

#pt .art.topContact{
	display:inline-block;
	vertical-align: top;
	margin: 0 3em;
	/* margin-bottom:2em; */
}

#pt .art.topContact .imgcont,
#pt .art.topContact .artp{
	display:inline-block;
	vertical-align:middle;
}

#pt .art.topContact img{
	margin-right:1em;
}
#pt .art.topContact .artp p{
	font-weight:600;
	font-size: 1.2em;
}

/* Search

#f3f4f6 - top line, image background
		#eeeff0
		#cac9c9
		#8d8d99 - dark border / nav /  footer
		#4d4f52 - dark text heading
		#d8e3e9 - footer alt text
		#a1c327 - actions
------------------------------------------------------- */
#pt .ext .search {
   display:inline-block;
   vertical-align: top;
   /* margin-bottom:2em; */
} 

#pt .ext .search form{
	background-color:#a1c327;
}
    
#pt .ext .search label {
    display: none;
}

#pt .ext #searchbox {
	background-color:#fff;
	border:1px #cac9c9 solid;
	display:inline-block;
	vertical-align:middle;
	color:#8d8d99;
	outline:0;
	border-right:0;
	padding: 0.625em;
	width:212px;
}

/*sort the placeholder color*/
#pt .ext #searchbox::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:#8d8d99;
}
#pt .ext #searchbox:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   opacity:  1;
   color:#8d8d99;
}
#pt .ext#searchbox::-moz-placeholder { /* Mozilla Firefox 19+ */
   opacity:  1;
   color:#8d8d99;
}
#pt .ext #searchbox:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#8d8d99;
}
#pt .ext #searchbox::-ms-input-placeholder { /* Microsoft Edge */
	color:#8d8d99;
}

#pt .ext#searchbox:focus{
    outline: 0;
    border: none;
}

#pt .ext .search input#search {
	display:inline-block;
	vertical-align:middle;
	background-color:transparent;
	outline: 0;
	border: none;
}

#pt .ext .search input[type="submit"] {}

/* Basket
------------------------------------------------------- */
#pt .bskt {
    display:inline-block;
    vertical-align: top;
    text-align:center;
    width: 270px;
    padding:.75em 0;
    /* outline:1px blue solid; */
}

#pt .bskt .bc {
}
#pt .bskt .bt {}
#pt .bskt .bt h3 {}

#pt .bskt #mybskt{
	float:right;
}

#pt .bskt #bsktitems {
	display:inline-block;
	vertical-align:middle;
	color:#a1c327;
}

#pt .bskt #bsktitems span{
	color:#9b9b9b;
	margin-right:1em;
	text-transform:uppercase;
}

#pt .bskt #bsktvalue {
	display:inline-block;
	margin-left:2em;
	vertical-align:middle;
	color:#000;
	font-weight:600;
}

#pt .bskt #bsktvalue span{
	display:none;
}

#pt .bskt span {}

#pt .bskt a.btn {
	display:inline-block;
	vertical-align:middle;
	margin-left:1em;
	padding:0;
	background:none;
	border:none;
}
#pt .bskt a.btn img {
	width:100%;
	height:auto;
}
#pt .bskt a.btn::after {}

#pt .bskt #bsktvalue span {}






/* Quick Order
------------------------------------------------------- */
#pt #qord {}
#pt #qord #qoresponse{}
#pt #qord label {}
#pt #qord input#qoref {}
#pt #qord input#qoref.inputtext {}
#pt #qord input#qoqty {}
#pt #qord .submit {}

/* -------------------------------------------------------------------------------------
=Breadcrumb 
------------------------------------------------------------------------------------- */
.bdcb {
    clear: both;
    width: 100%;
    padding-top:1em;
    padding-bottom:1em;
    border-bottom:1px #e3e3e3 solid;
}

/* typography
------------------------------------------------------- */
.bdcb h1,
.bdcb h2,
.bdcb h3,
.bdcb a{
    font-size:1em;
    margin: 0em 0.5em;
    font-weight:normal;
    display:inline-block;
}

.bdcb h1{
}

/*for the break between the crumb*/
.bdcb .bc ul li:nth-child(n)::after {
    content: ">";
    display: inline-block;
    font-weight:400;
    font-size:1em;
}

.bdcb .bc ul li:first-child h3{
	margin-left:0;
}

.bdcb .bc ul li:last-child::after {
    content: "";
}

#pc .bdcb .bc {
    margin: 0 auto;
    position: relative;
    margin-top:0;
    border-top:none;
}

.page_home .bdcb {
    display: none;
}

.bdcb .bt, .bdcb .bb {
    display: none;
}

.bdcb .bc ul li {
    display: inline-block;
}

 .bdcb .bc ul li h3, .bdcb .bc ul li a {
	color:#0d0d0d;
}

.bdcb .bc ul li h1{
	font-family: 'Open Sans', sans-serif;
	color:#605e5e;
}
.bdcb .bc ul li a:hover {
    text-decoration:underline;
}
.bdcb .bc ul li img {}


/* -------------------------------------------------------------------------------------
=CentrePanel 
------------------------------------------------------------------------------------- */

/* assumes there is ALWAYS a header banner on the page */
#pc {
    width: 100%;
    float:left;
    min-width: 1200px;
    background:
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center,
		/*url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTextureMid.png') no-repeat top 64px center,*/
		linear-gradient(#fff, #fff) 0px 64px no-repeat, /*was 258px */
		linear-gradient(#49708a, #49708a) 0px 64px no-repeat,
		linear-gradient(#605e5e, #605e5e) 0 0 no-repeat;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center,
		/*url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTextureMid.png') no-repeat top 64px center,*/
		-webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#fff)) 0 64px no-repeat,
		-webkit-gradient(linear, 0 0, 0 100%, from(#49708a), to(#49708a)) 0 64px no-repeat,
		-webkit-gradient(linear, 0 0, 0 100%, from(#605e5e), to(#605e5e)) 0 0 no-repeat;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png?_t=1781812317') repeat-x top center,
		/*url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTe xtureMid.png') no-repeat top 64px center,*/
		linear-gradient(#fff, #fff) 0px 64px no-repeat,
		-moz-linear-gradient(#49708a, #49708a) 0px 64px no-repeat, 
		-moz-linear-gradient(#605e5e, #605e5e) 0 0 no-repeat;

}

/*slightly different for the hp slider */
.home #pc {
    width: 100%;
    float:left;
    min-width: 1200px;
    background:
    	linear-gradient(#eeeff0, #eeeff0) 0px 564px no-repeat,
		linear-gradient(#49708a, #49708a) 0px 64px no-repeat,
		linear-gradient(#605e5e, #605e5e) 0 0 no-repeat,
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center,
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTextureFull.png') no-repeat top 64px center;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center,
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTextureFull.png') no-repeat top 64px center,
		-webkit-gradient(linear, 0 0, 0 100%, from(#eeeff0), to(#eeeff0)) 0px 564px no-repeat,
		-webkit-gradient(linear, 0 0, 0 100%, from(#49708a), to(#49708a)) 0 64px no-repeat,
		-webkit-gradient(linear, 0 0, 0 100%, from(#605e5e), to(#605e5e)) 0 0 no-repeat;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png?_t=1781812317') repeat-x top center,
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTextureFull.png') no-repeat top 64px center,
		-moz-linear-gradient(#eeeff0, #eeeff0) 0px 564px no-repeat, 
		-moz-linear-gradient(#49708a, #49708a) 0px 64px no-repeat, 
		-moz-linear-gradient(#605e5e, #605e5e) 0 0 no-repeat;
}

/*no second wood effect/header on prod buy pages */
.confirmation #pc,
.passwordchange #pc,
.useraccount #pc,
.orderinfo #pc,
.register #pc,
.signin #pc,
.checkoutprocess #pc,
.basket #pc,
.buy #pc{
	    width: 100%;
    float:left;
    min-width: 1200px;
    background:
		linear-gradient(#fff, #fff) 0px 64px no-repeat,
		linear-gradient(#605e5e, #605e5e) 0 0 no-repeat,
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png') repeat-x top center,
		-webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#fff)) 0 64px no-repeat,
		-webkit-gradient(linear, 0 0, 0 100%, from(#605e5e), to(#605e5e)) 0 0 no-repeat;
    background: 
		url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/woodTexture.png?_t=1781812317') repeat-x top center,
		-moz-linear-gradient(#fff, #fff) 0px 64px no-repeat, 
		-moz-linear-gradient(#605e5e, #605e5e) 0 0 no-repeat;
}

#pc .bc {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    text-align:center;
}


#site.home #pc {}
#site.home #pc .bdcb {
	display:none;
}



#pc .bc .art.topCTA{
	display:inline-block;
	margin:0 4em;
}

#pc .bc .art.topCTA .bc{
	width:auto;
}

#pc .bc .art.topCTA  .imgcont,
#pc .bc .art.topCTA  .artp{
	display:inline-block;
	vertical-align:middle;
	margin: 0.8em 1em;
}

#pc .bc .art.topCTA  .artp h4{
	color:#fff;
	font-size:1em;
	font-weight:600;
	text-align:left;
}

#pc .bc .art.topCTA  .artp p{
	color:#bec3c9;
	font-size:0.875em;
	text-align:left;
}

#pc .bc .pbnr {}
#pc .bc .pbnr img {}
#pc .bc .pbnr h3 {}

/* -------------------------------------------------------------------------------------
=MainPanel 
------------------------------------------------------------------------------------- */

#pmid {
    width:100%;
    clear: both;
    margin: 0 auto;
    padding: 0;
    position: relative;
    display:flex;
    min-height:40vh;
    padding-top: 2em;
    margin-bottom: 2em;
    /* border-top:1px #cacaca solid; */
}

#pm {
    /* float: left; */
    clear: both;
    width:1200px;
    margin: 0 auto;
    position: relative;
}

#pm.pmwide {
    clear: none;
}

#pm.pmfull {
    width: 1200px;
    background-color:transparent;

}
#pmid.page_home {
	padding-top:0;
	border-top:0;
    background:linear-gradient(to bottom, #eeeff0 0, #eeeff0 380px,  transparent 380px, transparent 100% );
}

.page_home #pm.pmfull .bc{
}

#pm.pmfull .bc{}

#pm .pmind {}


/* -------------------------------------------------------------------------------------
=Right Panel 
------------------------------------------------------------------------------------- */
#pr {
    width: 25%;
    float: right;
    padding:1em;
}

/* -------------------------------------------------------------------------------------
=Left Panel 
------------------------------------------------------------------------------------- */

#pl {
    width: 31%;
    margin-right:2em;
}

#pl .pbnr {}
#pl .bnr {}
#pl .bnr span {}
#pl .bt {
	background-color:#eeecec;}
#pl .bt h3 {
	text-transform:uppercase;
	font-weight:600;
	font-size:1.2em;
	padding:1em;
	margin:0;
	}
#pl .bc {}
#pl .bc #sldiv {}
#pl p {}
#pl a {}
#pl .bb {}


/* -------------------------------------------------------------------------------------
=Footer - comes before pb
------------------------------------------------------------------------------------- */
#pf {
    width: 100%;
}

#pf .ext {
    width: 100%;
    min-width:1200px;
    margin: 0 auto;
    position: relative;
    /* margin-bottom:2em; */
}


#pf ul {}
#pf ul li {}
#pf ul li:last-child {}


/* Typography
------------------------------------------------------- */

#pf h2,
#pf h3,
#pf h4,
#pf span,
#pf strong{}

#pf a,
#pf p{
}

#pf a:hover{
}

#pf h2,
#pf h3,
#pf h4{
}

#pf p,
#pf li,
#pf .news label{
}

#pf .info,
#pf .art,
#pf .pbnr{
	width:100%;
}

#pf .pbnr img{
	/* width:100%; */
	height:auto;
}

/* Client specific
------------------------------------------------------- */

/*bottom ctas are not full width  bit of a hack this i guess */
#pf .pbnr#p31621126{
	width:1200px;
	margin:auto;
}

#pf .pbnr .footerCTA{
	display:inline-block;
}


/*remove the carousel bottom margin */
#pf .carousel{
	margin-bottom:0;
}
.footerCTA,
.footerCTAlight{
	overflow:hidden;
	display:inline-block;
	position:relative;
	margin-right:1.8em;
	margin-bottom:1.8em;
}

.footerCTA:last-child,
.footerCTAlight:last-child{
	margin-right:0;
}

.footerCTA img,
.footerCTAlight img{
	display:block;
}

.footerCTA .toi,
.footerCTAlight .toi{
	position:absolute;
	top: 6.5em;
	color:#fff;
	text-align:center;
	width:100%;
}

.footerCTA .toi a.txt,
.footerCTA .toi h3,
.footerCTAlight .toi a.txt{
	font-weight: 600;
	margin:1em 0;
	font-size:1.5em;
	color:#18191a;
}

.footerCTA .toi p,
.footerCTAlight .toi p{
	font-size:1em;
	margin-top:.5em;
	color:#e5ddcb;
	text-transform:uppercase;
	font-size:0.813em;
	width:75%;
	margin:auto;
	line-height:1.5em;
}

.footerCTAlight .toi p{
	color:#5d7482;
}

/* bottom about us article + featured image */
#pf .art.bottomAbout{
	width:1200px;
	margin:auto;
}

#pf .art.bottomAbout .artp{
	display:inline-block;
	vertical-align:top;
	width: 696px;
	margin-right:2em;
	padding-top:2em;
}

#pf .art.bottomAbout .artp p:first-of-type{
	font-weight:600;
	font-size:1.1em;
	line-height:1.8em;
}

#pf .art.bottomAbout .artp p{
	margin-bottom:2em;
	line-height:2em;
	font-size:.875em;
}

#pf .art.bottomAbout .artp img{
	float:left;
	margin:0em 2em 2em 0em;
}

#pf .art.bottomAbout .imgcont{
	vertical-align:top;
	display:inline-block;
	/* background-color:#f2f9f9; */
	padding:2em 0;
	padding-left:2em;
}

/* -------------------------------------------------------------------------------------
=Bottom Panel 
------------------------------------------------------------------------------------- */

#pb {
    margin: 0em auto;
    width: 100%;
    min-width: 1200px;
    float: left;
    background:#8d8d99;
}

#pb .ext {
    width: 1200px;
    margin:0 auto;
    position: relative;
}

#pb .pipe {
    display: none;
}

#pb ul {
    list-style: none;
}

#pb .info h3,
#pb .art h2,
#pb .news h3,
#pb .pbnr h3 {
	font-size:1.125em;
	color:#0d0d0d;
	margin-top:3em;
	margin-bottom:2em;
	font-weight:600;
}

#pb .info a:hover,
#pb .art a:hover{
	text-decoration:underline;
}

/* Article panes (text and social links)
------------------------------------------------------- */
#pb .art {
	width:auto;
	margin-right: 1em;
	float:left;
}

#pb .art li {}

#pb .art p {}

#pb .art img{
	display:inline-block;
	margin:.5em;
}

#pb .art.footerContact{
	width: 450px;
}
#pb .art.footerContact .artp ul{
	float:left;
	width:50%;
	color:#d8e3e9;
	font-size:.875em;
	font-weight:600;
}
#pb .art.footerContact .artp ul li{
	margin-bottom:1em;
}

#pb .art.footerContact .artp ul a{
	font-weight:normal;
	color:#fff;
}


#pb .art.footerContact .artp ul strong{
	color:#fff;
}

#pb .art.footerContact .artp h2,
#pb .art.footerContact .artp p{
	width:50%;
	float:right;
	clear:right;
	margin:0;
	padding:0;
}

#pb .art.footerContact .artp h2{
	color:#fff;
	font-size:.875em;
	font-weight:normal;
	margin-bottom:1em;
}
#pb .art.footerContact .artp p{
	color:#d8e3e9;
	font-size:.875em;
	line-height:2
}

/* Information panes (site links)
------------------------------------------------------- */
#pb .info {
	width:auto;
	margin-right: 2em;
	float:left;
	/* min-width:200px; */
	margin-bottom:3em;
}

#pb .info:first-child {}
#pb .info li {
	margin-bottom:1em;
	color:#fff;
	font-size:0.875em;
	margin-right:2em;
}

#pb .info li a:hover{
	text-decoration:underline;
	text-decoration-color:#d8e3e9;
}

#p31621128 ul{
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;

}

/* Social Icons
------------------------------------------------------- */
#pb .socbook{}

#pb .socbook h3 {}

#pb .socbook ul li {}



/* Information panes (site links)
------------------------------------------------------- */
#pb .pbnr {
	width:auto;
	margin-right:1em;
	float:left;
	/* min-width: 204px; */
	margin-bottom:3em;
}

#pb .pbnr:first-child {}
#pb .pbnr li {
	margin-bottom:1em;
}

#pb .pbnr li a:hover{
	text-decoration:underline;
}


/* Newsletter signup;
------------------------------------------------------- */
#pb .news{
	float:left;
	width: 230px;
	margin-right:1em;
}

#pb .news .bc label{
	display:block;
	color:#0d0d0d;
	font-weight:600;
	margin-bottom:1em;
}

#pb .news .bc .news_input_container{
	float:left;
}

#pb .news .bc .news_input_container .submit{
	background-color:#a1c327;
	color:#fff;
	margin-top:1em;
	font-size:.8em;
}


/* Payment Logos
------------------------------------------------------- */

/* Feefo Service rating
------------------------------------------------------- */

/* -------------------------------------------------------------------------------------
=Copyright and Managed by 
------------------------------------------------------------------------------------- */

.etailcopy {
	display:inline-block;
	width:100%;
	color:#d8e3e9;
}

p.copy{
	float:left;
}
p.etail {
	float:right;
}

p.copy {
	display:inline-block;
	margin-right: 1em;
}

p.copy span {
}


/* cookie popup
------------------------------------------------------- */
#pbf .cookie {
    position: fixed;
    bottom: 0%;
    left: 0%;
    width: 100%;
    z-index: 1000;
    background: var(--altColor);
    text-align: center;
}

#pbf .cookie p {
    margin: 0 auto;
    float: none;
    color: #fff;
    padding: .5em 0
}

#pbf .cookie p a {
    float: none;
    color: #fff;
    text-decoration: underline;
    padding: 0 5px
}

#pbf .cookie img {
    float: none;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px
}

#pbf .cookie img:hover {
    cursor: pointer
}


/* -------------------------------------------------------------------------------------
=FilterSearch 
------------------------------------------------------------------------------------- */


#pl .filter{
	border:1px #eeecec solid;
}


#pl .filter .bc .ContainerPanel .HeaderContent, #pl .filter .bc .ContainerPanel .HeaderContentClose {}
#pl .filter .bc .ContainerPanel .Content .citem {}
#pl .filter .bc .ContainerPanel .Content .citem:hover {}
#pl .filter .bc .ContainerPanel .Content .citem span {}
#pl .filter .bc .ContainerPanel .Content {}
#pl .filter .bc .ContainerPanel .Content .showmore {
    cursor: pointer;
}

.filter .bt {
    background-repeat: no-repeat;
    width: 100%;
}

.filter .bt h3 {
    display: inline-table;
}

.longattrsection .items {
    overflow-x: hidden;
    -ms-overflow-x: scroll;
    margin-bottom: 1em;
}

.HeaderContent {
    cursor: pointer;
    border:1px #eeecec solid;
    border-left:0;
    border-right:0;
    padding:.5em 1em;
    font-weight:600;
}

.HeaderContent h5 {
	font-family: 'Open Sans', sans-serif;
	margin:0;
	text-transform:uppercase;
	font-size:.8em;

}

.collapsed h5 {
    /* background: url('/csi/3702784/4751360/i/bdr/ui_icons_hdr.png') no-repeat left -28px; */
}

.collapsed h5:hover {
    /* background: url('/csi/3702784/4751360/i/bdr/ui_icons_hdr.png') no-repeat left -14px; */
}

.items{
	margin:.5em 0
}

.citem {
	font-size:.9em;
	color:#0d0d0d;
    padding-left: 2.5em;
    padding-top: .5em;
    padding-bottom: .5em;
    letter-spacing: 0;
    margin: 0;
    background: url(/csi/3702784/4751360/i/bdr/selectbox_inactive.png) no-repeat 1em center;
    cursor: pointer;
}

.citem:empty {
    display: none;
}

.citem:hover {
    background: url(/csi/3702784/4751360/i/bdr/selectbox_active.png) no-repeat 1em center;
}

.citemselected {
    background: url(/csi/3702784/4751360/i/bdr/selectbox_active.png) no-repeat 1em center;
}

.citemselected:hover {
    background: url(/csi/3702784/4751360/i/bdr/selectbox_remove.png) no-repeat 1em center;
}

#divPriceRangeDisplay {
    height: 1em;
    margin-left: 1em;
    padding-top: 1em;
}

#sldiv {
    margin: 1em;
}

#resetfs {
	display:none;
}

#resetfs h5 {
    background: url(/csi/3702784/4751360/i/bdr/selectbox_remove.png) no-repeat 10px center;
    padding-left: 2em;
    text-transform: uppercase;
    cursor: pointer;
}


/* -------------------------------------------------------------------------------------
=SearchHeader / SearchFooter 
------------------------------------------------------------------------------------- */
.deptwrap{
    float:left;
}

.searchheader, .searchfooter {
    width: 100%;
    float:left;
    padding:1em 0;
}

#pm.pmfull .searchheader .bc,
#pm.pmfull .searchfooter{
    padding-bottom:1em;
    float:left;
    width: 98%;
    padding: 0 1%;
    margin:0;
}

.searchheader h5#rescou {
	display:inline-block;
    font-size:1em;
    margin:0;
    margin-right:1em;
}

.searchheader form {
    display:inline-block;
    margin-right:1em;
}

.searchheader .search form {
    display: none;
}

.searchheader form label {
    margin-right:0.5em;
    font-weight:normal;
}

.searchheader form label[for="searchbox"] {
    display: none;
}

.searchheader .paging {
    float: right;
}

.searchheader .paging label,
.searchfooter .paging label {
    display: none;
}

.searchheader .paging span,
.searchheader .paging a,
.searchfooter .paging span,
.searchfooter .paging a {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

.searchheader .paging a,
.searchfooter .paging a {
    margin: 0 .25em;
    font-weight:normal;
}

.searchheader .paging span,
.searchfooter .paging span {
    padding:.25em;
}

.searchheader .search input#searchbox {}

.searchheader .search input.submit {
    padding: 0 0.25em;
}

.searchheader label[for="rpp"] {}

.searchfooter .paging {
    float: right;
}

#sr {
    float: left;
}

.pmfull #sr .fprd:nth-child(4n){
	margin-right:0;
}

.pmwide #sr .fprd:nth-child(3n){
	margin-right:0;
}


/* -------------------------------------------------------------------------------------
=Department Tree 
------------------------------------------------------------------------------------- */
.depttree .bt {
    clear: both;
}


/* dept title
------------------------------------------------------- */
.depttree > .bt h3{
	display:none;
}

/* dept strapline
------------------------------------------------------- */
.depttree h4{
    display:none;
}

.depttree ul{
    list-style:none;
    width:100%;
    margin-left:0px;
    text-align:center;
}

.depttree li{
    display:inline-block;
    margin: 0 0.8em;
    margin-bottom: 2.3em;
    text-align: left;
    text-transform:none;
    vertical-align:top;
    font-size:1em;
    /* outline:1px red solid; */
    max-width:272px;
}


.depttree li a.img{
	float:left;
	margin-bottom:1em;
}

.depttree li img{
	-webkit-transition: -webkit-transform .5s ease-in-out;
        transition:         transform .5s ease-in-out;
	display:block;
	width:100%;
	height:auto;
}

/*zoom in*/
.depttree li img:hover{
    -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
}

.depttree li a.txt{
	font-size:1.125em;
	font-weight:600;
	color:#000;
	float:left;
	clear:both;
	text-align:center;
	width:100%;
}

.deptprods{
    text-align:center;
}

.deptprods h3{
    margin:1em;
    margin-bottom:.5em;
}

.deptprods a.seeall{
    display:block;
    font-size:.8em;
    margin-bottom:.5em;
}

/* -------------------------------------------------------------------------------------
=FeaturedProducts 
------------------------------------------------------------------------------------- */

.fprd {
    float: none;
    display:inline-block;
    vertical-align:top;
    position: relative;
    margin-bottom: 1em;
    text-align:center;
    width: 284px;
    margin-right: 1em;
    margin-bottom:1em;
    border:1px #eeecec solid;
}

.fprd:hover {

		-webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
}



/* hover image effects
------------------------------------------------------- */
.fprd{
  -webkit-transition: -webkit-transform .5s ease-in-out;
          transition:         transform .5s ease-in-out;
}


/*zoom in*/
.fprd:hover:hover{
    -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
}

/* fprd image
------------------------------------------------------- */
.fprd .fprdimg {
    overflow:hidden;
    position: relative;
    text-align:center;
    width:100%;
}

.fprd .fprdimg img {
	width:100%;
    height: auto;
    margin:0 !important;
}

.fprd .fprdimg a {}

.fprd .fprdimg .flag {
    position:absolute;
    top:0em;
    right:0em;
    overflow:visible;
}

.fprd .fprdimg .flag img {}



.fprd.bBar   .fprdimg:after{
	display:block;
	position: absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/5079040/i/bdr/Breakfast.png?_t=1949165457') no-repeat center;
	background-size:100%;
	pointer-events:none;
}

.fprd.uShape .fprdimg:after{
	display:block;
	position: absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/5079040/i/bdr/U_shape_lighter.png?_t=1949122434') no-repeat center;
	background-size:100%;
	pointer-events:none;
}

.fprd.straight .fprdimg:after{
	display:block;
	position: absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/5079040/i/bdr/Straight.png?_t=194916558') no-repeat center;
	background-size:100%;
	pointer-events:none;
}

.fprd.lShape .fprdimg:after{
	display:block;
	position: absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/5079040/i/bdr/L_Shape.png?_t=194916558') no-repeat center;
	background-size:100%;
	pointer-events:none;
}

.fprd.boards .fprdimg:after{
	display:block;
	position: absolute;
	content:"";
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/5079040/i/bdr/boards.png?_t=1949122434') no-repeat center;
	background-size:100%;
	pointer-events:none;
}




/* fprd title
------------------------------------------------------- */
.fprd .fprdtitle {
	height:3em; /*max number of lines before display issues!*/
	margin:.5em;
	text-align:center;
	color:#0d0d0d;
}


/* fprd model # and other options (controlled in COMS)
------------------------------------------------------- */
.fprd .model {}
.fprd .model span {}
.fprd .packsize {}
.fprd .packsize p {}
.fprd .brand {
		font-family: 'Open Sans', sans-serif;
	font-size:.9em;
	color:#8a8a8b;
	text-transform:uppercase;
	font-weight:600;
}
.fprd .brand span, .fprd .manu span {
	/*its a shame that coms writes out a span with : in it even if the brand label is blank! */
	display:none;
}
.fprd .fprddescr {}


/* fprd pricing info
------------------------------------------------------- */
.fprd h6{
    font-weight:normal;
    margin-bottom:0;
	font-family: 'Open Sans', sans-serif;
	font-size:.813em;
	color:#8a8a8b;
}

.fprd .price,
.fprd .prevprice,
.fprd .offer,
.fprd .trade {
    display:inline-block;
    margin:.5em;
    margin-top:0;
    font-size:1.5em;
}

/*normal price */
.fprd .price {
	display:block;
}
.fprd .price h6{
	display:inline-block;
	vertical-align:middle;
	padding-left:1em;
} 
.fprd .price label{
	font-size: .6em;

	display:inline-block;
	vertical-align:middle;
} 

/*rrp price */
.fprd .rrp {}
.fprd .rrp h6{}
.fprd .rrp label{} 

/*offer price */
.fprd .offer {}
.fprd .offer h6{
    color:#a1c327;
}
.fprd .offer label{
	font-size: .6em;
	display:inline-block;
	vertical-align:middle;
} 

/*previous price (goes with offer) */
.fprd .prevprice {}
.fprd .prevprice h6{
    text-decoration: line-through;
}
.fprd .prevprice label{
	font-size: .6em;
	display:inline-block;
	vertical-align:middle;
}  

/*trade price */
.fprd .trade {}
.fprd .trade h6{}
.fprd .trade label{} 

/*buy on page form */
.fprd form {
	font-size:.8em;
	margin-bottom:1em;
}
.fprd form input.submit[name="buy"] {
	margin-left:.5em;
}

.fprd form input.submit[name="PreOrder"],
.fprd form input.submit[name="preorder"] {}

.fprd form label {
	display: none;
}
.fprd form input.inputtext {}
.fprd form select {
	display:inline-block;
	margin-bottom:.5em;
	max-width: 90%;
}

.fprdinfo {
display:inline-block;
text-align:center;
margin:.5em;
}

.fprd input.submit, .fprdinfo a {}
.fprdinfo a.btn {
	/* display:none; */
	display:inline-block;
}
.fprdinfo a.qkvw {
	display:none;
}


/* overrides for carousel products */

.carousel .fprd{
	width:100%;

}


/* -------------------------------------------------------------------------------------
=ProductLists 
------------------------------------------------------------------------------------- */
.prdlst {}

.prdlst .bt {
    width: 100%;
    text-align: center;
}

.prdlst .bc {
    width: 100%;
}

.prdlst .bt h3 {}

.prdlst ul {
    float:left;
    list-style: none;
    width:100%;
}

.prdlst li {
    float: left;
    position: relative;
    margin: 0px 0px;
    margin: 0 .5em;
    margin-bottom: 1em;
    text-align:center;
}

.prdlst li:hover{}

.prdlst li a.img {}

.prdlst h3 {
    width: 100%;
}

.prdlst li a {
    width: 100%;
}

.prdlst a.img img {
    width: 100%;
    height: auto;
}

.prdlst li a.txt {
    width: 100%;
    text-align: center;
}

.prdlst li .price {
    text-align: center;
}

.prdlst li .price label,
.prdlst li .offer label {
    display: none;
}

.prdlst li .price h6,
.prdlst li .prevprice h6,
.prdlst li .offer h6 {
    text-align: center;
}

.prdlst li .offer h6 {
    float: right;
}

.prdlst li .prevprice {
    display: none;
}


/* -------------------------------------------------------------------------------------
=RecentItems 
------------------------------------------------------------------------------------- */
.ritm {
    width: 100%;
}

.ritm .bt {
    width: 100%;
}

.ritm h3 {
    margin: 0;
}

.ritm ul {
    width: 100%;
}

.ritm ul li {}
.ritm ul li a.img {}
.ritm ul li a.img img {}

.ritm ul li a.txt {
    float: left;
    clear: both;
}

.ritm ul li .price,
.ritm ul li .qty,
.ritm ul li .trade{
    float:left;
    clear:both;
    width:100%;
    font-size:1em;
}

.ritm ul li .price label,
.ritm ul li .qty label,
.ritm ul li .trade label{
}


/* -------------------------------------------------------------------------------------
=HoverBsket 
------------------------------------------------------------------------------------- */
.hoverbskt {
	float: right;
	position: absolute;
	margin-top: 1em;
	width: 299px;
	padding: 0;
	z-index: 2000;
	background: #fff;
            -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
	text-align:center;
}

.hoverbskt h3{
	display:none;
}

.hoverbskt .lines {
    max-height: 240px;
    width: 100%;
    overflow-y: scroll;
    float: left;
}

.hoverbskt .lines .item {
    float: left;
    padding: .5em;
}

.hoverbskt .lines .item:last-child {
    border-bottom: 0px;
}

.hoverbskt .formupdate{
    float:left;
    width: 150px;
}

.hoverbskt .formupdate input{
    width:50px;
    margin-right:1em;
}

.hoverbskt .formupdate input.submitQtyChange{
    width:20px;
    text-indent:-999999px;
    outline:none;
    background:url('/csi/3276800/4096000/i/bdr/bsktupdate.png') no-repeat 0 0;
    border:none;
}

.hoverbskt a,.hoverbsktadd a {
    float: right;
    text-align: center;
}

.hoverbskt a.btn{
    float: none;
    display:inline-block;
    text-align: center;
    width: 220px;
    margin:.5em;
    padding: .5em 0;
}

.hoverbskt .lines .item a.title{
    float: left;
    margin-bottom:.5em;
    width: 191px;
    text-align: left;
    font-size: .8em;
}

.hoverbskt .lines .item img{
    float: left;
    height: auto;
    width: auto;
    max-width: 64px;
    max-height: 64px;
    padding-right: .5em;
}

.hoverbskt .lines .item p.descr {
    float: left;
    width: 191px;
    text-align: left;
    font-size: .8em;
        margin-bottom:.5em;
}

.hoverbskt .lines .item p.qty {
	clear:both;
    float: left;
    width:50%;
    line-height:1em;
    text-align: left;

    font-size: .8em;
    margin-top:.5em;
}

.hoverbskt .lines .item p.price{
    float: left;
    margin-top:.5em;
    width:50%;
    text-align: right;
    font-size: .8em;
    font-weight:600;
}

.hoverbskt h4.count {
	display:none;
}

.hoverbskt h4.total {
	float:left;
	width:100%;
	text-align:center;
	font-size:1em;
	margin-bottom:0;
	margin-top:.5em;
}


/* -------------------------------------------------------------------------------------
=PopupDialog / Popup Add to Basket / Direct Despatch
------------------------------------------------------------------------------------- */

.hoverbsktadd,
#popupdialog {
	display: none;
	position: fixed;
	top: 25%;
	left: 40%;
	width: 480px;
	padding: .5em;
	background-color:#fff;
	color:#3d4146;
	border:1px solid #a1c327;
	z-index: 2000;
}

.hoverbsktadd .item,
#popupdialog .item {
	padding: 0.25em;
	display:inline-block;
}

.hoverbsktadd h3,
#popupdialog h3 {
	font-size:1.25em;
}

.hoverbsktadd a,
#popupdialog a {
	text-align: center;
}

.hoverbsktadd .item a.title,
#popupdialog .item .title {
	float:left;
	width:350px;
	text-align: left;
}

.hoverbsktadd .item img,
#popupdialog .item img {
	float: left;
	height: auto;
	width: auto;
	padding-right: 1em;
}

.hoverbsktadd .item p.qty,
#popupdialog .item p.qty {
	float:left;
	text-align: left;
	width:350px;
	font-size:.8em;
}

.hoverbsktadd .item p.price,
#popupdialog .item p.price {
	text-align: right;
	float:left;
	width:350px;
}

.hoverbsktadd a[title="Checkout"] {
	float:right;
    font-weight:600;
    font-size:1em;
    padding:.5em 1em;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:.5em;
    color:#fff;
    border:1px #a1c327 solid;
    background-color:#a1c327;
}

.hoverbsktadd a[title="Checkout"]:hover{
	color:#a1c327;
    border:1px #a1c327 solid;
    background-color:transparent;
}

#popupdialog .useraccount{
	float:left;
	clear:both;
	width:100%;
}

#popupdialog .useraccount input{
	float:right;
	font-size:.9em;
}

#popupdialog .useraccount a{
	float:left;
	font-weight:600;
	padding:.5em;
	border: none;
	text-align: center;
	text-transform: uppercase;
	cursor:pointer;
}

/* Out of Stock, Direct Despatch
------------------------------------------------------- */

.ui-dialog.outofstockdialog,
.ui-dialog.directdespatchdialog{
    width: 500px !important;
    background-color: #fff;
    text-align: center;
            -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
}	


.ui-dialog.outofstockdialog .outofstockpopup,
.ui-dialog.directdespatchdialog .directdespatchpopup-pane{
    border: none;
    color: #a1c327;
    -webkit-box-shadow: none;
    -moz-box-shadow:    none;
    box-shadow:         none;
}

.ui-dialog.outofstockdialog  .outofstockpopup .oosheader,
.ui-dialog.directdespatchdialog .ui-widget-header{
    padding: 0 0 1em 0;
}

.ui-dialog.directdespatchdialog .ui-widget-header{
    display: none;
}

.ui-dialog.directdespatchdialog .ui-widget-header .ui-dialog-titlebar-close{
    display: none;
}

.ui-dialog.outofstockdialog .outofstockpopup .oosmessage .oosdate {}

.ui-dialog.outofstockdialog .ui-dialog-titlebar{
    display: none;
}

.ui-dialog.outofstockdialog .ui-widget-content,
.ui-dialog.directdespatchdialog .ui-dialog-buttonpane{
    background: transparent;
    border: none;
    margin-top: 0;
    text-align:center;
    padding:0;
}

.ui-dialog.outofstockdialog  .ui-widget-content .ui-dialog-buttonset,
.ui-dialog.directdespatchdialog .ui-dialog-buttonpane .ui-dialog-buttonset{
	float:none;
}

.ui-dialog.outofstockdialog  .ui-widget-content .ui-dialog-buttonset button,
.ui-dialog.directdespatchdialog .ui-dialog-buttonpane .ui-dialog-buttonset button{
    outline: none;
    border-radius:0;
    border:none;
    margin:.5em;
    text-transform:uppercase;
}

.ui-dialog.directdespatchdialog .ui-dialog-buttonpane .ui-dialog-buttonset button:first-child{
}

.directdespatchdialog .ui-dialog-buttonpane .ui-dialog-buttonset button{}

#directdespatchpopup-pane span.ddproduct{
	font-size:1.5em;
	display:block;
	margin-bottom:1em;
}

.ddmessage{}

.ddmessage span.dddatemessage{}

.ddmessage span.dddate{
	float:left;
	width:100%;
	margin-top:1em;
	font-size:1.2em;
}

/* -------------------------------------------------------------------------------------
=Basket - Checkout 
------------------------------------------------------------------------------------- */
#checkoutcrumb{
	width:100%;
	text-align:center;
}

#checkoutcrumb li{
	font-size:1em;
	font-weight:600;
}

#checkoutcrumb .chksteps_curr{
	display:none;
}

.page_basket .bskt table.basket {
	border-collapse: collapse;
	margin-bottom:1em;
}

.page_basket .bskt table.basket td {}
.page_basket #basket_row_processing {}

.page_basket table.basket tr.line td form table td .inputtext {
	position: relative;
}

/* Basket Table Header
------------------------------------------------------- */
.page_basket table.basket tr.header th {
	text-align: center;

}

.page_basket .bskt table.basket tr.header th:nth-child(2) {
	text-align: left;
}

.page_basket .bskt table.basket tr.header th:nth-child(4) {
	text-align: center;
}

.page_basket .bskt h3 a:hover,
.page_basket .bskt h3 a:focus {
	text-decoration: underline;
}


/* Basket Line Items
------------------------------------------------------- */
.page_basket table.basket tr.line td form {
	float: right;
	width: 100%;
}

#pm table.basket tr.line input.inputtext {
    width: 130px;
    margin: .25em 0px;
    padding: .25em 0px;
    font-size: 1em;
    text-align: center;
}

#pm table.basket tr.line input.submit {
    margin-top: 1em;
}

.page_basket table.basket tr.line input.submit#update {
	float: left;
	outline:1px #a1c327 solid;
	background-color:#fff;
	color:#a1c327;
	font-size:.6em;
	cursor:pointer;
	margin-left: 1em;
	border-radius:0;
}

.page_basket table.basket tr.line input.submit#update:hover {
	background-color:#a1c327;
	color:#fff;
}

.page_basket table.basket tr.line input.submit#remove,
.page_basket table.basket tr.line input.submit#removesample {
	float: right;
	outline:1px #d94927  solid;
	background-color:#fff;
	border-color:#d94927;
	color:#d94927 ;
	font-size:.6em;
	cursor:pointer;
	margin-right: 1em;
	border-radius:0;
}

.page_basket table.basket tr.line input.submit#remove:hover {
	background-color:#d94927 ;
	color:#fff;
}

.page_basket table.basket tr.line {
    border-bottom: 2px solid #d5d6d6 ;
}


.page_basket table.basket tr.line .prodinfo li{
	font-size:.9em;
}


.page_basket table.basket tr.line .prodinfo a{
	font-size:1.2em;
	font-weight:600;
	padding-bottom:.9em;
	display:block;
}


.page_basket table.basket tr.line .prodinfo .surcharge{
	font-style:italic;
}

.page_basket table.basket tr.line a.img {
	width: 84px;
	display:block;
	height: auto;
}

.page_basket table.basket tr.line td {
	vertical-align: middle;
}

.basket-header-table td {}

.basket-header-table td:first-child h2 {}

.basket-header-table td:last-child {
	text-align: right;
	float: right;
}

.basket-header-table td:last-child .sp_button {
	float: right;
}

.basket-header-table td .pp_button,
.basket-header-table td span {}


.page_basket table.basket tr.delivery{
	background-color:#f2f9f9;
}

.page_basket table.basket .delivery td,
.page_basket table.basket .discount td {
	padding-left: 1em;
}

.page_basket table.basket .delivery td.title{
	padding-top:2em;
}

.page_basket table.basket .delivery td.info,
.page_basket table.basket .discount td.info{
	padding-top:2em;
}


.page_basket table.basket .deliverto span{
	font-size: 1em;
}

.page_basket table.basket .delivery .shipcurr td{
	font-size:1em;
	font-weight:600;
}

.page_basket table.basket .delivery td.title form{
	display:inline-block;
	margin-right:1em;
}

.page_basket table.basket .delivery h4 {
	margin-bottom:0px;
	font-size: 1.25em;
	display:inline-block;
	font-weight:600;
}

.page_basket table.basket .delivery select{
	margin-right:1em;
}

.page_basket table.basket .shipcost {
	padding-bottom:1em;
}

.page_basket table.basket .shipcost td {
	font-size:.9em;
}

.page_basket table.basket .shipcost .ship .delivery-cost {}

.page_basket table.basket .vat {
	border-top: 1px solid #d5d6d6 ;
}

.page_basket table.basket .vat td {}

.page_basket table.basket .vat td:first-child {
	text-align: right;
}

.page_basket table.basket tr.total td,
#pm table.basket tr.deposit td {
	text-align: right;
	border-top: 1px solid #d5d6d6 ;
	border-bottom: 1px solid #d5d6d6 ;
	font-weight:600;
	font-size:1.2em;
}


.page_basket table.voucher{
	width:600px;
	background: #eef2f3;
}

.page_basket table.voucher tr.header th {
	border:none;
	text-transform:none;
	font-size:1em;
	display:none;
}

.page_basket table.voucher input.submit {
	margin-left:1em;
}

.page_basket table.voucher input.inputtext {}

.page_baskettable.voucher .inputtext {}
.page_basket.basket ul {}

.page_basket .basket ul li {
	clear: left;
}

.page_basket .basket ul li.model{
	font-size:.8em;
}

.page_basket .basket ul li.ref{
	font-size:.8em;
}

.page_basket .basket ul li.lead{
	color:#a1c327;
	font-size:.8em;
}


/* Payment Options
------------------------------------------------------- */
/* payment options - shows above the basket which no one likes!!! */
.basket-header-table {
	width: 100%;
	display:none;
}

.page_basket .bskt .basketlinks {
	float: left;
	width: 100%;
	margin-top: 1em;
	margin-bottom:1em;
}

.page_basket .ct_button a.btn {
	float: left;
	margin-right:1em;
	border-color:#8d8d99;
	color:#8d8d99;
	background-color:transparent;
}


.page_basket .ct_button a.btn:hover {
	float: left;
	margin-right:1em;
	border-color:#8d8d99;
	color:#fff;
	background-color:#8d8d99;
}

.page_basket .bskt .basketlinks .sp_button {
	float: right;
}

.page_basket .sp_button a.btn {
	float: left;
	margin-left:1em;
	padding:.5em 2em ;
}

.page_basket .bskt .basketlinks span {
	float: right;
	margin: 1em;
}

.page_basket .bskt .basketlinks .pp_button {
	float: right;
}

.page_basket .bskt .basketlinks #LoginWithAmazon2{
	float:right;
}

.page_basket .pp_button a.btn {
	display: block;
	margin-left:1em;
	padding:0px;
	background-color:transparent;
	height:32px;
}

.page_basket .pp_button a.btn img{
	height:100%;
	width:auto;
}

#pm #paypalmessages {
	text-align: center;
}

#pm #paypalmessages p {
	width: 100%;
	text-align: center;
}

/* -------------------------------------------------------------------------------------
=Checkout process Need !important to override jquery ui 
------------------------------------------------------------------------------------- */

#checkout_panel_processing,
#ro_accord_processing {
	position: absolute;
	width: 100%;
	padding: 20px 10px;
	opacity: 0.6;
	filter: Alpha(Opacity=60);
	float: right;
	background-color: #000;
}

#pm .accord {
	width: 834px;
	float: left;
	margin-right:1em;
	overflow-x: visible;
}

/* sign in in accordion */
#signinform h5{
	font-size:.8em;
}

#signinform  li{
	float:left;
	clear:both;
}

#signinform input.inputtext{
	width:300px;
}

#signin_skip{
	float:right;
	line-height:normal;
	font-weight:600;
	padding:.5em;
	border: none;
	color: #979797;
	margin-right:1em;
	text-align: center;
	text-transform: uppercase;
   	background: #eef2f3;
	cursor:pointer;
}

/* typography 
------------------------------------------------------- */

#pm .accord p,
#pm .accord li,
#pm .accord label {
}

#pm .accord input[type="text"],
#pm .accord input[type="tel"],
#pm .accord input[type="input"],
#pm .accord input[type="email"] {}

#pm .accord ul li select {
	font-size:1em
}

#pm .accord textarea {
	height: 50px;
}


/* Accordion tabs 
------------------------------------------------------- */

.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	color:#fff;
	right:0;
	left:initial;
    background-image: url(https://download.jqueryui.com/themeroller/images/ui-icons_fff_256x240.png);
}

#pm .accord h3 {
	padding: 0.5em 0 ;
	margin: 0;
	width: 100%;
	position: relative;
	cursor: pointer;
	background:#8d8d99 ;
	border:none;
	color:#fff;
	font-weight:600;
	font-size:1.2em;
	margin-bottom:2px;
	border-radius:0;
}

#personalisation_panel, #gift_panel {
	border: none;
}

#checkout_accordion ul {
	list-style: none;
}


/*gift wrapping and personalisation? */
#checkout_accordion form#gift_details ul li.prod,
#checkout_accordion form#personalisation_details ul li.prod{
	width:98%;
	float:left;
	padding:.5em 1%;
	border-top:2px #d5d6d6 solid;
}

#checkout_accordion form#gift_details ul li.prod .img,
#checkout_accordion form#personalisation_details ul li.prod .img{
	float:left;
	margin-right:1em;
}

#checkout_accordion form#gift_details ul li.prod p,
#checkout_accordion form#personalisation_details ul li.prod p {
	font-size:1.2em;
}

#checkout_accordion form#gift_details ul li.itemno,
#checkout_accordion form#personalisation_details ul li.itemno {
	width:100%;
	float:left;
	font-weight:600;
}

#checkout_accordion form#gift_details ul li label,
#checkout_accordion form#personalisation_details ul li label{
	width:400px;
	margin-right:1em;
	display:inline-block;
	float:none;
	font-size:.8em;
	vertical-align:top;
}

#checkout_accordion form#gift_details ul li span,
#checkout_accordion form#gift_details ul li select,
#checkout_accordion form#gift_details ul li textarea,
#checkout_accordion form#personalisation_details ul li span,
#checkout_accordion form#personalisation_details ul li select,
#checkout_accordion form#personalisation_details ul li textarea{
	display:inline-block;
	float:none;
	margin-bottom:.5em;
}

#checkout_accordion form#gift_details ul li select,
#checkout_accordion form#gift_details ul li textarea,
#checkout_accordion form#personalisation_details ul li select,
#checkout_accordion form#personalisation_details ul li textarea{
	width: 378px;
	border:1px #5a5858 solid;
}

#checkout_accordion form#gift_details ul li span.chars,
#checkout_accordion form#personalisation_details ul li span.chars{
	width:100%;
	margin-bottom:1em;
	font-size:.7em;
	text-align:right;
}

/* Post Code Lookup */
#checkout_accordion .pclup{
	margin-bottom:1em;
}

#checkout_accordion .pclup #txtPostCodeLookup{
	width:70px;
	padding:.4em;
	font-size:.8em;
}

#checkout_accordion .pclup .submit#btnPostCodeLookup{
	font-size:.8em;
	float:none;
	margin:0;
	margin-left:.5em;
	display:inline-block;
}

#checkout_accordion .pclup span.or{
	font-size:.8em;
	margin:0 .5em;
	display:inline-block;
	float:none;
}

#checkout_accordion .pclup #pclupManualAddress{
	float:none;
	padding:.5em;
	font-weight: 600;
	line-height:normal;
	display:inline-block;
	font-size:.8em;
	text-transform: uppercase;
}

#checkout_accordion ul li input,
#checkout_accordion ul li select,
#checkout_accordion ul li textarea {}
#checkout_accordion ul li textarea {}
#checkout_accordion ul li label[for=deliveryInst] {}

#checkout_accordion ul li.wrap {
	position: relative;
}

#checkout_accordion ul li.wrap span {
	position: absolute;
	top: 0;
	right: 0;
}

#checkout_accordion ul li.total {
	display: none;
}

#checkout_accordion #signin_panel,
#checkout_accordion #customer_panel, 
#checkout_accordion #delivery_panel,
#checkout_accordion #confirm_panel,
#checkout_accordion #payment_panel,
#checkout_accordion #gift_panel,
#ro_accord #product_panel,
#ro_accord #member_panel,
#ro_accord #delivery_panel,
#ro_accord #preference_panel,
#ro_accord #loyalty_panel {
	padding:1em;
}

#checkout_accordion #confirm_panel h5{
	font-size:1em;
}

#checkout_accordion #confirm_panel a{
	float:left;
	background:#a1c327;
	color:#fff;
	padding:.25em;
}


#ro_accord #product_details ul li table {}

#ro_accord #product_details ul li table tr td {
	border-bottom: none;
}

#ro_accord #product_details ul li table table {
	width: auto;
}

#checkout_accordion #signin_panel ul, 
#checkout_accordion #ul_top, 
#checkout_accordion #ul_bottom, 
#ro_accord #product_panel ul, 
#ro_accord ul.top, 
#ro_accord ul.bottom {
	width: 100%;
	margin: 0;
	padding: 0;
}


#checkout_accordion #ul_bottom{
	float:left;
	clear:both;
}

#ro_accord ul.top {}
#ro_accord ul.bottom {}

#checkout_accordion #ul_left, 
#checkout_accordion #ul_right, 
#ro_accord ul.left, 
#ro_accord ul.right {
	width: 400px;
	float: left;
	margin: 0;
}

#checkout_accordion #ul_left {
	font-size:1em;
}

#checkout_accordion #ul_right, 
#ro_accord ul.right {}

#checkout_accordion #basket_delivery_details a {
	color:#fff;
	float:left;
	clear:both;
	background-color:#a1c327;
	padding:.25em;
}

#checkout_accordion #basket_delivery_details a:hover {}

#checkout_accordion ul li, 
#checkout_accordion #ul_top li, 
#checkout_accordion #ul_left li, 
#checkout_accordion #ul_right li, 
#checkout_accordion #ul_bottom li, 
#ro_accord ul.top li, 
#ro_accord ul.left li, 
#ro_accord ul.right li, 
#ro_accord ul.bottom li {
	width: 100%;
	margin: 0;
	font-size:.9em;
	margin-bottom:1em;
}

#checkout_accordion ul li.reqmsg, 
#checkout_accordion #ul_top li.reqmsg, 
#checkout_accordion #ul_left li.reqmsg, 
#checkout_accordion #ul_right li.reqmsg, 
#checkout_accordion #ul_bottom li.reqmsg, 
#ro_accord ul.top li.reqmsg, 
#ro_accord ul.left li.reqmsg, 
#ro_accord ul.right li.reqmsg, 
#ro_accord ul.bottom li.reqmsg {
	padding: .25em 0;
	color: #a1c327 ;
}

#checkout_accordion #ul_right li.reqmsg a {
	padding: 0;
	margin: 0;
	float: none;
}

#checkout_accordion ul li label, 
#checkout_accordion #ul_top li label, 
#checkout_accordion #ul_left li label, 
#checkout_accordion #ul_right li label, 
#checkout_accordion #ul_bottom li label, 
#ro_accord ul.top li label, 
#ro_accord ul.left li label, 
#ro_accord ul.right li label, 
#ro_accord ul.bottom li label {
	width: 100%;
	margin: 0;
}

label[for="deliveryInst"] {
	display: none;
}

#checkout_accordion #ul_left li label[for="subscribe"] {
	width: auto;
}

#checkout_accordion #ul_left .help{
	float:left;
	font-size:.7em;
}

#pm .accord h4 {
	width: 100%;
	margin: 0;
}

#pm .accord label {
	/* float:left; */
}

#pm .accord ul li input, 
#pm .accord ul li select, 
#pm .accord ul li textarea,
#pm .accord ul li span {
	float:left;
	clear:both;
	margin-bottom:1em;
}

#pm .accord ul li textarea {}

#pm .accord ul li input.submit {
	float: right;
}

#pm .accord li #submit {}


/* Specific Fields 
------------------------------------------------------- */

#pm #email.inputtext {}

#pm #specialInst {
	width: 310px;
}

#checkout_accordion #ul_right #basket_delivery_address ul {
	width: 100%;
	margin: 0;
	padding: 0;
}

#checkout_accordion #ul_bottom li #pdeldate {
	width: 100%;
	padding: 0;
}

#checkout_accordion #ul_bottom li #pdeldate h3,
#ro_accord #pdeldate h3 {
	display: none;
}

#checkout_accordion #ul_bottom li #pdeldate p,
#ro_accord li #pdeldate p {
	width: 100%;
	margin: 0;
}

#checkout_accordion #ul_bottom li #pdeldate p.reqmsg {
	font-size: 1em;
}


/* Confirm Basket 
------------------------------------------------------- */

#checkout_accordion #confirm_panel ul,
#checkout_accordion #confirm_panel ul li,
#checkout_accordion #confirm_panel ul li table,
#ro_accord #loyalty_panel table {
	width: 800px;
	margin: 0;
}

#checkout_accordion #confirm_panel table span {}

#checkout_accordion #confirm_panel table a {
	margin: 0;
	clear: both;
}

#checkout_accordion #confirm_panel ul li table {
	border-collapse: collapse;
}

#checkout_accordion #confirm_panel ul li table th {}

#checkout_accordion #confirm_panel ul li table td {
	vertical-align: top;
}


/* Payment 
------------------------------------------------------- */

#checkout_accordion #payment_panel #psagepay {
	width: 800px;
	margin: 0;
	padding: 0;
}

#checkout_accordion #payment_panel #psagepay.form .bt,
#checkout_accordion #payment_panel #psagepay.form .bb {
	display: none;
}

#checkout_accordion #payment_panel #psagepay.form .bc {
	border: none;
	padding: 0;
}

#checkout_accordion #payment_panel #psagepay h3 {}
#checkout_accordion #payment_panel #psagepay iframe {}




.dnapayments.payoptentry {
	background-color:var(--white);
	padding:1em;
	margin-bottom: 1em;
	grid-row: 5;
}

#submitpaymentpanel{
	display:inline-block;
	width:100%;
	margin:0;
	color:#fff;
}

.hostedfield {
	height:35px;
	border-color:#ebd8d8;
	border-radius: .25rem;
	font-size: 16px;
	padding: 8px;
	width: auto;
	border-width:1px;
	border-style:solid;
	margin-bottom:.5em;
}

.dna-payments-hosted-field-focused {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.dna-payments-hosted-field-valid {
  border-color: #28a745;
}
.dna-payments-hosted-field-valid.dna-payments-hosted-field-focused {
  box-shadow: 0 0 0 0.2rem rgb(40, 167, 69, 0.25);
}
.dna-payments-hosted-field-invalid {
  border-color: #dc3545;
}
.dna-payments-hosted-field-invalid.dna-payments-hosted-field-focused {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

#threedsecurecontainer{
	min-width: 515px;
}
/* dna payments */
.pt_debitcreditcard {
	grid-area:dna;
}

.pt_debitcreditcard a{
	display:block;
	border-radius:0;
	/* color:var(--black); */
	/* font-weight:600; */
	height: 46px;
	padding:0;
	align-content:center;
	border:0;
	border-radius:4px;
}

.pt_debitcreditcard a:hover{
	border:none;
}

.pt_debitcreditcard a:before{
	content:'\f09d';
	font-family:var(--font-awesome);
	margin-right:.5em;
}

/* google pay */
.pt_googlepay {
	grid-area:google;
}
#googlepaybtncontainer {
	height: 46px;
	border-radius:4px;
}


/* apple pay */
.pt_applepay  {
	 grid-area:apple;
}
#applepaybtncontainer {
	height: 46px;
}



/* Anchor buttons 
------------------------------------------------------- */

#checkout_accordion a, #checkout_accordion a#delivery_to_other {
	width: auto;
	text-decoration: none;
}

#checkout_accordion a strong {
	width: auto;
	height: auto;
	text-transform: uppercase;
}

#checkout_accordion a strong:hover {
	text-decoration: underline;
}

#checkout_accordion li.info {}

/* -------------------------------------------------------------------------------------
=Basket - Checkout v5
------------------------------------------------------------------------------------- */
/*needs #pm as .bskt is used in the header */
#pm .bskt {
	margin:1em 0;
}

/*checkout breadcrumb added - controls the order of the checkout process
doesn't do accordion stuff though */
.chkcrumb{
	text-align:left;
	font-size:.750em;
	padding:.5em;
	/* currently not wanting to show this - ultimately this will be a setting in coms as to whether it is displayed or not at each stage */
	display:none;
}

.chkcrumb .prev,
.chkcrumb .curr,
.chkcrumb .next{
	display:inline-block;
	margin-right:.5em;
}

.chkcrumb .numbers{
	display:inline-block;
}

.chkcrumb .text{}

.chkcrumb .curr{
	font-weight:600;
}

.chkcrumb .prev .numbers{}

/* if basket is empty and user is in it */
.bskt .empty{
	margin:10em 0;
}

.bskt .empty .header{
	color:var(--textColor);
	background:none;
}

.bskt .empty .total{
	text-align:center;
}

/* Basket header
------------------------------------------------------- */
.bskt .header{
    font-family:var(--mainFontBold);
	padding:.5em;
}

/* Basket Lines
------------------------------------------------------- */
.bskt .lines{}

/* Basket Line items
------------------------------------------------------- */
.bskt .lines .line{
	display:grid;
	grid-gap: 1em;
	grid-template-columns: 100px 6fr 1fr 2fr 30px 1fr;
	padding:1em;
	align-self:center;
	align-items:start;
}

.bskt .lines .line:nth-child(odd){
	background-color:var(--bgColor);
}

/* Image */
.bskt .lines .line .prodimg{
	grid-column:1;
	grid-row:1;
}

.bskt .lines .line .prodimg a,
.bskt .lines .line .prodimg a img{
	display:block;
	text-align:center;
	margin:auto;
}

/* Product Info - in list form */
.bskt .lines .line .prodinfo{
	grid-column:2;
	grid-row:1;
	align-self:start;
}

.bskt .lines .line .prodinfo li.descr{
	font-size:1em;
	font-weight:600;
		margin-left:0em;
}
.bskt .lines .line .prodinfo li.subset,
.bskt .lines .line .prodinfo li.model,
.bskt .lines .line .prodinfo li{
	font-size:.875em;
	margin-left:1em;
}

/* remove item */
.bskt .lines .line .rem{
	grid-column:5;
	grid-row:1;
	align-self:start;
	text-align:center;
		align-self:center;
}

.bskt .lines .line .rem .submit {
	margin:0;
	padding:0;
	border:none;
	outline:none;
	background:none;
}

.bskt .lines .line .rem .submit{}

.bskt .lines .line .rem .submit:hover {}

/* Change quantity */
.bskt .lines .line .qty{
	grid-column:4;
	grid-row:1;
	font-size:.875em;
	text-align:center;
	align-self:center;
}

.bskt .lines .line .qty label{
	display:none;
}

.bskt .lines .line .qty button{
	display:inline-block;
	vertical-align:middle;
	border:1px var(--textColor) solid;
	background-color: var(--white);
	color:var(--textColor);
	font-weight:600;
	font-size:1.2em;
	padding:.25em .5em;
}

.bskt .lines .line .qty input{
	display:inline-block;
	vertical-align:middle;
	margin: 0 .5em;
	text-align:center;
}

.bskt .lines .line .netprice {
	grid-column:3;
	font-size:.875em;
}

.bskt .lines .line .netprice label,
.bskt .lines .line .netprice span{
	font-size:.750em;
	display:inline-block;
}

.bskt .lines .line .netprice label{
	margin-right:.25em;
}

.bskt .lines .line .price {
	grid-column: 6;
	grid-row: 1;
	text-align:right;
	font-family:var(--mainFontBold);
	align-self:center;
}

/* out of stoc messages */
.oos{
	color:var(--mainColor);
	font-size:.725em;
}

/* Basket Subtotal
------------------------------------------------------- */
.prodsubtotal{
	padding:1em;
	border-top:1px var(--textColor) solid;
	border-bottom:1px var(--textColor) solid;
	text-align:right;
}

.prodsubtotal label{
	margin-right: 1em;
}

.prodsubtotal span{
	font-size:1.2em;
    font-family:var(--mainFontBold);    
}

/* Delivery info
------------------------------------------------------- */
/* for free delivery messages */
.header.free{
	background:none;
	color:var(--textColor);
	padding:1.5em;
	font-size:.875em;
}

.header.delivery{
	/*doesn't exist but should be on the actual delivery header */
}

/* Shipping 
------------------------------------------------------- */
.shipping{
	padding:1em;
}

/* no need to show this unless collect option is available */
.shipping .deliveryto h4{
	display:none;
}

.shipping .address input,
.shipping .address h4{
	display:inline-block;
	vertical-align:middle;
	font-size:1em;
	margin:.25em;
}

.shipping .store input,
.shipping .store h4{
	display:inline-block;
	vertical-align:middle;
	font-size:1em;
	margin:.25em;
}

.shipping .deliveryto form{
	text-align:center;
}

/* if there ARE delivery choices */
.shipping form select{
	width:100%;
	margin-bottom:1em;
}

/* if there are NOI delivery choices */
.shipping .deliverto span{
	font-weight:600;
}

li.shipping{
	padding:0;
	text-align:right;
}

/* selected shipping cost*/
li.shipping form span{
	font-weight:600;
	margin-left:.5em;
}


/* Basket Totals
------------------------------------------------------- */
.bskttotals{
	border-top:3px var(--textColor) solid;
	border-bottom:3px var(--textColor) solid;
	padding:1em;
	text-align:right;
}

.bskttotals label{
	display:inline-block;
}

.bskttotals span{
	font-family:var(--mainFontBold);
	/*fix a min width for different number alignment */
	display:inline-block;
	width:8em;
}

.bskttotals .total{
	font-size:1.5em;
}
.bskttotals .total span{
	/* reset span size as font size if .total font size is bigger */
	width:5.3333333333em;
}

/* Vouchers
------------------------------------------------------- */
.vouchentry{
	display:inline-block;
	text-align: left;
	background: #eef2f3;
	padding:1em;
}

#pm ul.accordion li.pane ul.vouch li,
.vouchentry ul.vouch li{
	display:inline-block;
}


/* Basket Payment Buttons
------------------------------------------------------- */
.bsktbuttons{
	text-align:right;
	margin:.5em 0;
	font-size: 1em;
}

.bsktbuttons .sp_button,
.bsktbuttons .pp_button{
	display:inline-block;
	vertical-align:middle;
	margin:0 .5em;
}

.bsktbuttons a{
	padding:.5em;
	margin:.5em 0;
	text-align:center;
	cursor:pointer;
	border:none;
	outline:none;
	color:#fff;
}

.bsktbuttons .pp_button a.btn{
	background:none;
	padding:0;
}

/*font awesome icons */
#pm .sp_button a.btn.sagepay:before{
	font-family: "Font Awesome 5 Pro";
	font-weight: 600;
	margin-right: .5em;
	font-size: 1em;
	display:inline-block;
	content: '\f09d';
}

#pm .sp_button a.btn.bacs:before{
	font-family: "Font Awesome 5 Pro";
	font-weight: 600;
	margin-right: .5em;
	font-size: 1em;
	display:inline-block;
	content: '\f19c';
}

#pm .sp_button a.btn.lease:before{
	font-family: "Font Awesome 5 Pro";
	font-weight: 600;
	margin-right: .5em;
	font-size: 1em;
	display:inline-block;
	content: '\f154 \f154 \f154';
}

.page_basket .btn.cont a.btn {
	display:inline-block;
	margin:.5em 0;
	border-color:var(--bgColor);
	color:var(--bgColor);
	background-color:var(--mainColor);
}

.page_basket .btn.cont a.btn:hover {
	color:#ffffff;
	background-color:var(--bgColor);
}
.page_basket .btn.clear a.btn {
	display:inline-block;
	margin:.5em 0;
}

.page_basket .btn.clear a.btn:hover {}

/* Media Queries
------------------------------------------------------- */
/* over 600px wide and less than 800px */
@media screen and (max-width:800px ){}

/* over 400px wide and less than 600px wide */
@media screen and (max-width:600px ){}

/* under 32400px0px wide */
@media screen and (max-width:400px ){
	/* add an extra row and change order of things */
	.bskt .lines .line .qty{
		grid-column:1/4;
		font-size:.875em;
	}

	.bskt .lines .line .prodinfo{
		grid-column:2/5;
		grid-row:1;
	}

	/* remove item */
	.bskt .lines .line .rem{
		grid-column:4;
		grid-row:2;
	}

	.bskt .lines .line .netprice {
		grid-column:1/3;
	}

	.bskt .lines .line .netprice label,
	.bskt .lines .line .netprice span{
		font-size:.750em;
	}

	.bskt .lines .line .price {
		grid-row:3;
	}
}

/* -------------------------------------------------------------------------------------
=Checkout v5 Accordion Option
------------------------------------------------------------------------------------- */

/* Defaults / Overrides 
------------------------------------------------------- */
#checkout_panel_processing,
#ro_accord_processing {
	position: absolute;
	display:none;
	width: 100%;
	padding: 20px 10px;
	opacity: 0.6;
	filter: Alpha(Opacity=60);
	float: right;
	background-color: var(--textColor);
}

#pm .accord {
	width: 834px;
	margin-right:1em;
	overflow-x: visible;
}

/* Accordion tabs 
------------------------------------------------------- */
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	color:#ffffff;
	right:0;
	left:initial;
	background-image: url(https://download.jqueryui.com/themeroller/images/ui-icons_fff_256x240.png);
}

#pm .accord h3 {
	padding: 0.5em 0;
	margin: 0;
	width: 100%;
	position: relative;
	cursor: pointer;
	background:var(--bgColor);
	border:none;
	color:#3d4146;
	font-weight:600;
	font-size:1.2em;
	margin-bottom:2px;
	border-radius:0;
}

#personalisation_panel, #gift_panel {
	border: none;
}

#pm .accord h4 {}
#pm .accord label {}

#pm .accord ul li input, 
#pm .accord ul li select, 
#pm .accord ul li textarea,
#pm .accord ul li span {
	margin-bottom:1em;
}

#pm .accord ul li textarea {}
#pm .accord ul li input.submit {}
#pm .accord li #submit {}
#checkout_accordion {}
#checkout_accordion input.inputtext,
#checkout_accordion input.inputtext_light,
#checkout_accordion select,
#checkout_accordion textarea {}

#checkout_accordion #deliveryInst{
	width:90%;
}

#checkout_accordion select{
	grid-column: 1/2;
}

.ui-accordion .ui-accordion-content {
	padding: 1em ;
	border-top: 0;
	overflow: auto;
}

#checkout_accordion #ul_left li,
#checkout_accordion #ul_right li{
	margin-bottom:1em;
	display:grid;
	grid-template-columns:10fr .5fr;
	align-items:center;
	grid-gap:.25em;
}

#checkout_accordion #ul_left li.subscribe{
	grid-template-columns:2em 1fr;
	align-items:center;
}

#checkout_accordion #ul_left li.subscribe input{
	margin-bottom:0;
}

 #checkout_accordion  #delivery_panel #ul_left li{
	grid-template-columns:1fr;
}

/* Typography
------------------------------------------------------- */

/* Specific Fields 
------------------------------------------------------- */
/* sign in in accordion */
#signinform h5{
	font-size:.8em;
}

#signinform li{}

#signinform input.inputtext{
	width:300px;
}

#signin_skip{
	line-height:normal;
	font-weight:600;
	padding:.5em;
	border: none;
	color: var(--textColorLight);
	margin-right:1em;
	text-align: center;
	text-transform: uppercase;
 	background: #eef2f3;
	cursor:pointer;
}


/* Main accordion Sections 
------------------------------------------------------- */
#ul_top{
	font-size:.875em;
	margin-bottom:1em;
}
#ul_left{}
#ul_right{}

#ul_bottom .continue{
	margin:auto;
	text-align:center;
}

/* Customer Details 
------------------------------------------------------- */
#customer_panel #ul_left,
#customer_panel #ul_right{
	width:calc(50% - 1em);
	display:inline-block;
	vertical-align:top;
	padding:0 .5em;
}


/* Delivery Address 
------------------------------------------------------- */
#delivery_panel #ul_right{
}

#delivery_panel .address,
#delivery_panel #basket_delivery_address,
#delivery_panel .address ul{
	grid-column:1/3;
}

/* Confirm Panel inc Basket Summary
------------------------------------------------------- */
#confirm_panel{
	padding:0;
}

#confirm_panel .continue{
	margin:auto;
	text-align:center;
}

.basketsummary .header{
	margin:0;
	color:var(--textColor);
	padding:.5em;
	background-color:#ffffff;
	text-align:center;
}

.bsktsum{}

.bsktsum .line{
	display:grid;
	grid-gap:.5em;
	padding:.5em;
	grid-template-columns: 3fr .5fr 1fr;
	align-self:center;
}

.bsktsum .line:nth-child(odd){
	background-color:var(--bgColor);
}

.bsktsum .qty{
	text-align:right;
}

.bsktsum .qty label{
	display:none;
}

.bsktsum .price{
	font-weight:600;
	text-align:right;
}

/* no one wants to send people back to the basket at this point - needs to be removed from basket summary */
.bsktsum .editbskt{
	display:none;
}

.bsktsum .line .prodinfo li{
	font-size:.725em;
}

.bsktsum .line .prodinfo li.descr {
	font-size:1em;
	font-weight:600;
}

/* Basket Subtotal
------------------------------------------------------- */
.bsktsum .subtotal{
	padding: .5em;
	text-align:right;
}

/* Basket Totals
------------------------------------------------------- */
.bskttotals{
	border-top:3px var(--textColor) solid;
	border-bottom:3px var(--textColor) solid;
	padding:1em;
	text-align:right;
}

.bsktsum .subtotal label{
	display:inline-block;
}

.bsktsum .subtotal span{
	font-weight:600;
	/*fix a min width for different number alignment */
	display:inline-block;
	width:5.3333333333em;
}

.bsktsum #ordertotal{
}
.bskttotals #ordertotal{
	/* reset span size as font size if .total font size is bigger */
	width:5.3333333333em;
}

/* Payment Panel Totals
------------------------------------------------------- */
#payment_panel{}
#payment_panel .form{}

#delivery_date_panel .continue{
	margin:auto;
	text-align:center;
}

/* PAY WITH AMAZON 
------------------------------------------------------- */

/*
Please include the min-width, max-width, min-height 
and max-height if you plan to use a relative CSS unit 
measurement to make sure the widget renders in the 
optimal size allowed.    
*/

#addressBookWidgetDiv {
      min-width: 300px;
      max-width: 100%;
      min-height: 228px;
      height: 300px;
}

#walletWidgetDiv {
      min-width: 300px; 
      max-width: 100%;
      min-height: 228px; 
      height: 300px;
}

#shippingSelector{
    border:1px solid #bbb;
    margin:1em 0;
    padding:0 1em;
}

#amazonShippingSelection > span{
    margin-top:.5em;
    font-size:1.2em;
    font-weight:600;
    width:100%;
    display:inline-block;
}

#amazonShippingSelection > span +span{
    font-weight:normal;
    margin-top:.5em;
    margin-bottom:.5em;
}

#shippingSelector amazonShippingSelection{
    outline:1px #a1c327 solid;
}

.amazonShippingCountryDiv span.label{
    font-weight:600;
    margin-right:1em;
}

.amazonShippingOptionsDiv span.value{
    float:right;
    font-weight:600;
}

.amazonShippingOptionsDiv{
    cursor:pointer;
}

.amazonShippingOptionDiv{
    width:40%;
    float:left;
    line-height: 30px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid #bbb;
    border-radius: 3px;
    display: block;
    text-decoration: none;
    margin: 0 3px 6px 0;
    padding: 0 20px 0 30px;
    color: #333;
    font-size: 11px;
    height: 30px;
    background: #f6f6f6;
    background: -moz-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: -webkit-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: -ms-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: linear-gradient(to bottom,#f6f6f6 0,#e1e1e1 100%);
}

.amazonShippingOptionsDiv:after{
	display:block;
	clear:both;
	content:'';
}

.amazonShippingOptionDiv.selected {
    background: #f6f6f6 url('https://images-na.ssl-images-amazon.com/images/G/01/ep/background-image-1x._V313533909_.png') -130px -293px no-repeat;
}

.amazonShippingOptionDiv.selected:hover {
    background: #ececec url('https://images-na.ssl-images-amazon.com/images/G/01/ep/background-image-1x._V313533909_.png') -130px -293px no-repeat;
}

.amaznShippingOptionDiv:hover {
    background: #ececec;
    background: -moz-linear-gradient(top,#ececec 0,#d3d3d3 100%);
    background: -webkit-linear-gradient(top,#ececec 0,#d3d3d3 100%);
    background: -ms-linear-gradient(top,#ececec 0,#d3d3d3 100%);
    background: linear-gradient(to bottom,#ececec 0,#d3d3d3 100%)
}

.address-list li.selected a.invalid {
    background: #f6f6f6;
    background: -moz-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: -webkit-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: -ms-linear-gradient(top,#f6f6f6 0,#e1e1e1 100%);
    background: linear-gradient(to bottom,#f6f6f6 0,#e1e1e1 100%)
}

#cancelAmazon{
	background-color:#eef2f3;
	color:#416976;
	float:right;
	font-weight:600;
	padding:.5em;
}


.noshipping{
	color:#a1c327;
	margin-bottom:1em;
	font-weight:bold;
}

.submit[disabled]{
	background-color:#eef2f3;
	color:#fff;
}


/* Breadcrumb pane 
------------------------------------------------------- */

#pm .accordbdcb {
	float:left;
	width: 350px;
}

#pm .accordbdcb .checkoutLogos{
	text-align:center;
}

#pm .accordbdcb .checkoutLogos img{
	margin:.5em;
}

#pm .accordbdcb ul {
	border-bottom:2px #d5d6d6 solid;
	margin-bottom:.5em;
}

#pm .accordbdcb ul li {
	margin: .5em 0em 1em 1em;
}

#pm .accordbdcb ul li.header {
	/* font-weight: 600; */
	padding: 0;
	margin: 0;
	width: 96%;
	padding:.25em 2%;
	position: relative;
	cursor: pointer;
	border:none;
	font-size:1em;
	border-radius:0;
	background-color:#f3f4f6;
    color:#3d4146;
}

#pm .accordbdcb ul li:last-child {}

#pm .accordbdcb ul li.title {
	font-weight: 600;
	padding: 0;
	margin: 0;
	width: 96%;
	padding:.5em 2%;
	position: relative;
	cursor: pointer;
	border:none;
	font-size:1.2em;
	border-radius:0;
	margin-bottom:2px;
	background-color:#f3f4f6;
    color:#3d4146;
}

#pm .accordbdcb ul li span {}


/* Delivery date selection 
------------------------------------------------------- */

#pm .deldates .delcapnone {}
#pm .deldates .delcapgone {}


/* Order info 
------------------------------------------------------- */

#pm .ordinfo table tr td {}
#pm .ordinfo h3 {}

#pm .ordinfo table tr td a {
	clear: left;
	display: block;
	margin-bottom: 8px;
}


/* terms and conditions article in checkout
------------------------------------------------------- */

#pp {
	width: 1000px;
	margin: 0 auto;
	background-color: #fff;
}

#pp p, #pp h3, #pp h4 {
	margin: 0 1em;
}

#pp h3, #pp h4 {
	margin-bottom: .5em;
}


/* -------------------------------------------------------------------------------------
=Sitemap 
------------------------------------------------------------------------------------- */

#pm .smap ul {
    list-style-position: inside;
    width:100%;
}

#pm .smap ul li {
    padding: 1em 0;
}

#pm .smap ul li a,
#pm .smap ul li h3 {
    padding: 0;
}

#pm .smap .bc ul li ul {
    padding:1em 0;
    float:left;
}

#pm .smap ul li ul li {
    padding: 0;
}

/* First Level */
#pm .smap ul li{
    width:25%;
    float:left;
}
#pm .smap ul li a{
    font-weight:600;
    font-size:1.2em;
}

/* Second Level */
#pm .smap ul li ul{
    margin-left:2%;
    width:98%;
    float:left;
}
#pm .smap ul li ul li{
    width:100%;
}
#pm .smap ul li ul li a{
    font-weight:normal;
    font-size:1em;
}

/* Third Level */
#pm .smap ul li ul li ul li a{
    font-weight:normal;
}

/* -------------------------------------------------------------------------------------
=Messages 
------------------------------------------------------------------------------------- */

#mess {}
#mess ul {}
#mess ul.info li {}

#mess ul.warn li {
    color: #a1c327;
    font-weight:600;
    width:100%;}

h4.warn, .reqmsg, .err, .mess {
    color: #a1c327;
    font-weight:600;
    width:100%;
}

/* Email when back in stock */
#ewis h3{
    font-size:1.5em;
}

#ewis label{
    font-size:1em;
    font-weight:600;
}

/* -------------------------------------------------------------------------------------
=Autocomplete 
------------------------------------------------------------------------------------- */

.ui-helper-hidden-accessible {
    display: none;
}

.ui-autocomplete {
    width: 363px !important;
    z-index: 999999 !important;
    border-radius: 0;
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: scroll;
    border: .15em solid #25aac9;
    border-top:0;
    z-index: 2000;
    background: #fff;
            -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
}

/* because science.. yeah nah */

.ui-autocomplete#ui-id-1{
	width:100px !important;
}

.ui-autocomplete li.ui-menu-item  {
    width: 98%;
    float: left;
    cursor: pointer;
    margin:0px;
    padding:0px;
    margin-bottom:.5em;
    margin-top:.5em;
    margin:.5em 1%;
    display:block;
}

.ui-menu-item a{
    float:left;
    width:100%;
}

.ui-autocomplete li {
    list-style: none;
}

.ui-autocomplete li:hover {
}

.ui-menu .ui-menu-item a.ui-state-focus,.ui-menu .ui-menu-item a.ui-state-active{
    margin:0;
    outline:1px solid #ccc;
}

.ui-menu-item a.ui-state-active{
}

.foundProduct {
    float:left;
    width:80px;
    height:80px;
}

.foundProduct img {
    width: 100%;
    height: auto;
}

.foundProductTitle,
.foundProductRef,
.foundProductDesc  {
    margin-left:1em;
    float: left;
    width: 235px;
    font-size:.9em;
}

.foundProductDesc {
}

.ui-autocomplete mark {
    background-color: transparent;
    font-weight: 600;
    color:#25aac9
}

/* -------------------------------------------------------------------------------------
=QuickView 
------------------------------------------------------------------------------------- */

.quickview{
    background-color:rgba(0,0,0,0.5);
    width:100vw;
    height:100vh;
    z-index: 1010;
    position:fixed;
    top:0;
    left:0;
    padding-top:5%;
}
.quickviewdialog{
    width:800px;
    min-height:480px;
    max-height:80vh;
    margin:auto;
    background-color:#fff;
    z-index:999999;
    padding:1em;

    overflow-y:auto;
}

.quickviewdialog .quickviewHeader{
    width:100%;
    float:left;
}

.quickviewdialog .quickviewHeader .closeqkvw{
    float:right;
    position:relative;
    top:1em;
    right:1em;
    cursor:pointer;
}

.quickviewdialog .left{
	display:inline-block;
	vertical-align:top;
	width:40%;
}

.quickviewdialog .left .piimg{
    width:80%;
    padding:10%;
}

.quickviewdialog .left img{
    width:100%;
    height:auto;
}

.quickviewdialog .right{
	display:inline-block;
	vertical-align:top;
	width:60%;
}

.quickviewdialog .right .pititle,
.quickviewdialog .right .lnk,
.quickviewdialog .right .delivery{
    float:left;
    width:100%;
}

.quickviewdialog .right .delivery h4{
    margin-top:.5em;
    font-size:1.2em;
}

.quickviewdialog .right .brandmanu.model{
    float:left;
    width:100%;
}

.quickviewdialog .right .brandmanu.model h5,
.quickviewdialog .right .brandmanu.model h6{
    float:left;
    font-size:1.2em;
    margin-right:.5em;
}

.quickviewdialog .right .pidesc{
    float:left;
    width:100%;
    /* height: 3em; */
    overflow:hidden;
}

.quickviewdialog .right .pidesc h4{
	display:none;
}

.quickviewdialog .right .pidesc p{
}

.quickviewdialog .right .pidesc h2{
    display:none;
}

.quickviewdialog .right .lnk{
    font-size:.8em;
}

.quickviewdialog .right .pibuy{
    width:100%;
    float:left;    
}

.quickviewdialog .right .pibuy .price,
.quickviewdialog .right .pibuy .qty,
.quickviewdialog .right .pibuy .trade{
    float:left;
    width:100%;
   	color:#4b738e;
	font-size:1em;
	font-weight:600;
}




.quickviewdialog .right .pibuy .price label,
.quickviewdialog .right .pibuy .price h6{
    float:left;
    font-size: 1.5em;
    font-weight:600;
    margin:1em 0;
    margin-right:.5em;
}

.quickviewdialog .right .pibuy .qty label,
.quickviewdialog .right .pibuy .trade label,
.quickviewdialog .right .pibuy .qty h6,
.quickviewdialog .right .pibuy .trade h6{
    float:left;
    margin-right:.5em;
    font-size:1.2em;
    font-weight:600;
    text-transform:capitalize;
}

.quickviewdialog .right .pibuy form p{
    display:none;
}

.quickviewdialog .right .pibuy form .attrqty{
	display:inline-block;
	width:100%;
	text-align:center;
	margin:1em 0
}

.quickviewdialog .right .pibuy form .attrqty .qtyinput{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}

.quickviewdialog .right .pibuy form .attrqty input#buy{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}

.quickviewdialog .right .pibuy form .attrqty .qtyinput label{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}

.quickviewdialog .right .pibuy input#bspsubmit{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}

.quickviewdialog .right .pibuy form .attrqty .qtyinput input.inputtext{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}



.quickviewdialog .right .pibuy .stock,
.quickviewdialog .right .pibuy .title,
.quickviewdialog .right .pibuy .ewis_dialog,
.quickviewdialog .right .pibuy .ewis,
.quickviewdialog .right .pibuy .sahelpart{
    display:none;
}



.quickviewdialog .right .accordion {
	width:100%;
	display:inline-block;

}

.quickviewdialog .right .accordion .sa_name{
	display:none;
}

.quickviewdialog .right .accordion .fixedheader{

}


.quickviewdialog .right .accordion .cls_superattrribute {
	background-color:#f2f9f9;
	padding:1em;
}


.quickviewdialog .right .accordion .cls_superattrribute .att_X,
.quickviewdialog .right .accordion .cls_superattrribute .att_Y{
	display:inline-block;
	/* width: 50%; */
	margin:0.5em;
	margin-left:0;
}

.quickviewdialog .right .accordion .cls_superattrribute .att_X input,
.quickviewdialog .right .accordion .cls_superattrribute .att_Y input{
	width: 100px;
	display:inline-block;	
}


.quickviewdialog .right .accordion .cls_superattrribute .att_X label,
.quickviewdialog .right .accordion .cls_superattrribute .att_Y label{
	/* min-width: 100px; */
	display:inline-block;
	margin-right:1em;
	font-weight:600;
}

.quickviewdialog .right .accordion .cls_superattrribute img[id^="help"]{
	display:none;
}


.quickviewdialog .right .accordion  .cls_superattrribute .calc_price{
	display:inline-block;
	vertical-align:middle;
	margin:0.5em;
	/* filter:invert(100); */
}

.quickviewdialog .right .accordion  .cls_superattrribute .submit{

    font-weight:normal;
    font-size:1em;
    padding:0;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:0;
    color:#000;
    border:none;
    background-color:transparent;
}

/* -------------------------------------------------------------------------------------
=CustomPromotions
------------------------------------------------------------------------------------- */

/* HoldingPage
------------------------------------------------------- */

/* HomePage
------------------------------------------------------- */

.bannerLinkLarge{
	display:inline-block;
	position:relative;
	width: 584px;
	margin-bottom: 2em;
	margin-top:1em;
}
.bannerLinkLarge:first-child{
	margin-right: 2em;
}

.bannerLinkLarge img{
	display:block;
}

.bannerLinkLarge .toi{
	position:absolute;
	top:40%;
	width:100%;
	color:#fff;
	text-align:center;

}


.bannerLinkLarge .toi a.txt{
	font-family: 'Abril Fatface', cursive;
	text-transform:uppercase;
	font-size:3em;
}

.bannerLinkLarge .toi p{
	font-weight:600;
	text-transform:uppercase;
	margin-top:1em;
}

/* contact us page
------------------------------------------------------- */

/* laminate worktops link page - to worktops online */

#a98435073{
	text-align:center;
}

#a98435073 img{
	max-width:200px;
	height:auto !important;;
}


/* Set Width Articles/Banners
------------------------------------------------------- */

.contact #pm  .halfWidth{
	width: 570px;
	float:left;
	margin-right: 2em;
	margin-bottom:2em;
}

.contact #pm  .halfWidth .artp p:first-of-type{
	font-weight:600;
}

.contact #pm  .quarterWidth{
	width: 275px;
	margin-right: 2em;
	float:left;
	margin-bottom:2em;
}

.contact #pm .quarterWidth p{
	font-size:.9em;
}

.contact #pm .quarterWidth ul{
	list-style:none;
	font-size:.9em;
	margin:1em 2em;
}

.contact #pm .quarterWidth ul li{
	margin-bottom:.5em;
}

.contact #pm .quarterWidth ul li.email{
	background:url('/csi/3702784/4751360/i/bdr/emailicon.png') no-repeat left center;
	padding-left:2em;
}

.contact #pm .quarterWidth ul li.phone{
	background:url('/csi/3702784/4751360/i/bdr/telicon.png') no-repeat left center;
	padding-left:2em;
}


.contact #pm .quarterWidth ul.openingTimes span{
	width:100px;
	display:inline-block;
}

/* Quicklinks
------------------------------------------------------- */
.contact #pm .quickLinks{
	width: 289px;
	border:1px #cacaca solid;
	float:left;
	margin-bottom:2em;
}

.contact #pm .quickLinks h2{
	font-family: 'Abril Fatface', cursive;
	font-size:1.4em;
	padding:1em;
}

.contact #pm .quickLinks ul{
	list-style:none;
}

.contact #pm .quickLinks ul li{
	background:url('/csi/3702784/4751360/i/bdr/bullettick.png') no-repeat left center;
	padding-left:2em;
	margin-bottom:1em;
}

/*form */
.contact #pm .form{
	border:1px #cacaca solid;
	padding:2em;
	width: 504px;
	float:left;
	margin-right:2em;
}

.contact #pm .form label{
	min-width: 185px;
}

.contact #pm .form input,
.contact #pm .form textarea{
	width: 284px;
}

.contact #pm .form textarea{
	height: 154px;
}


.contact #pm .form .g-recaptcha{
	float:right;
}

.contact #pm .form input#submit{
	width:auto;
	margin-left:200px;
}
/* 404 page
------------------------------------------------------- */


/* -------------------------------------------------------------------------------------
=CustomArticles / CustomBanners
------------------------------------------------------------------------------------- */

/* BANNERS
------------------------------------------------------- */

/* Header Banners with Text Overlay - used throughout the site
------------------------------------- */

.headerBanner{
	float:left;
	position:relative;
	margin-top: 1.85em;
	text-align:center;
}

.headerBanner .toi{
	position:absolute;
	top: 33%;
	width:100%;
	color:#fff;
}

.headerBanner .toi h3{
	font-size: 3.75em;
	font-weight:600;
}


/* 3rd Width Banners with Text Overlay (used on HP)
------------------------------------- */
.banOverlay3rd{
	float:left;
	position:relative;
	margin-right: 1.85em;
	text-align:center;
}

.banOverlay3rd:nth-child(3n){
	margin-right:0;
}

.banOverlay3rd .toi{
	position:absolute;
	top:40%;
	width:100%;
	color:#fff;
}

.banOverlay3rd .toi a.txt{
	font-weight:600;
	color:#fff;
	font-size:2em;
}

.banOverlay3rd .toi p:before{
	content:"";
	border-bottom:2px #a1c327 solid;
	width:100px;
	height:2px;
	margin: 1.5em;
	display:inline-block;
}
	
.banOverlay3rd .toi p{
	font-weight:600;
	font-size:0.875em;
	text-transform:uppercase;
	color:#a1c327;
}

.banOverlay3rd img {
  -webkit-transition: -webkit-transform .5s ease-in-out;
          transition:         transform .5s ease-in-out;
          filter:brightness(80%)
  	
}

.banOverlay3rd img:hover{
    -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
            -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
}



.deptHeader{
	margin-bottom:1em;

	background-color:#f2f9f9;
	padding:1em;
}

.deptHeader .artp{
	display:inline-block;
	vertical-align:top;
	width:70%;
}

.deptHeader .artp p{
	font-size:.875em;
	padding-right:1em;
}

.deptHeader .imgcont{
	display:inline-block;
	vertical-align:top;
	width:30%;
	height:auto;
}

/*HACK - because the imgcont ISN'T used to put ALL images in! */
/*used on the hinges page only */
.deptHeader#a102268928 .imgcont +.imgcont{
	float:right;
	top:-430px;
	position:relative;
}

.deptHeader .imgcont img{
	width:100%;
	height:auto;
}


/*using a deptHeader text article AND a deptGallery articel*/

.deptGallery .deptHeader{
	display:inline-block;
	vertical-align:top;
	width:50%;
}

.deptGallery .deptHeader .artp{
	width:100%;
}

.deptGallery .deptGallery{
	display:inline-block;
	vertical-align:top;
	width:47%;

}

.deptGallery .deptGallery .carousel{
	margin:0;
}

/* ARTICLES
------------------------------------------------------- */

/*FAQs
------------------------------------- */

/* contact us page
------------------------------------- */


/* About US
------------------------------------- */



/* -------------------------------------------------------------------------------------
=AccordionArticles
------------------------------------------------------------------------------------- */

/* accordion descriptions 
------------------------------------------------------- */
#pm .bc ul.accordion {
    list-style: none;
    font-size: 1em;
    margin: 1em
}


.att_container{
	margin:0;
}
#pm .bc ul.accordion .pane {
    display: none
}

#pm .bc ul.accordion .pane {
    padding: .5em 2em;
	background-color:#f2f9f9;
}

#pm .bc ul.accordion li:nth-child(2) {
    display: block
}

#pm .bc ul.accordion li.header {
    background-color: #8d8d99;
    color: #fff;
    font-size: 1.25em;
    margin: 0;
    padding: .35em;
    position: relative;
    cursor: pointer;
    margin-top: .5em;
}

#pm .bc ul.accordion li.header img {
    position: absolute;
    right: .6em;
    width: 1em;
    height:1em;
    cursor: pointer;
}

#pm .bc ul.accordion li.header img.showminus {
    /* display: none; */
}

#pm .bc ul.accordion li.header.current img.showminus {
    /* display: block; */
    /* position: absolute; */
    /* top: .75em; */
    /* width: auto; */
}

#pm .bc ul.accordion li.header.current img.showplus {
    display: none
}

#pm .bc .accordion p {
    color: inherit;
    font-size: 1.2em
}

#pm .bc .accordion a {
    color: #071689;
    font-weight: 600
}

#pm .bc .accordion a:hover {
    text-decoration: underline;
    text-decoration-color: #071689
}

#pm .bc .accordion span {
    font-weight: 800
}


/* -------------------------------------------------------------------------------------
=Blog
Absoulute positioning is used because of the order the content comes outline

There is no blog "promotion" page and as such you need to ensure that you have a blank promotion set up - and set as the default promotion
if you don't do this then you will end up with the home page promotion content showing on this (and other) pages

there is no ability to dictate the order of the blog content (img/title/date/read) and as such absolute positioning must be used

WHICH IS A NIGHTMARE!
------------------------------------------------------------------------------------- */

.page_blog #pm .bc h2{}
.page_blog #pm .art.blog .bc h2 {}
.page_blog .blog {}
/*the +1 bit is becuase of the none wanted h2 that sits above the first row
go read about nth-selectors to figure out why this is! */
.page_blog .blog:nth-child(3n+1){}
#pm .blog img {}
#pm .page_blog .art.blog img{}
.page_blog .blog p.date {}
.page_blog .blog a.title {}
.page_blog .artp{}
.page_blog .artp p{}
.page_blog .blog a.more {}
.page_blog .art.blog {}

/* individual blog post overrides/resets */
.page_blog .art.blog .artp{}
.page_blog .art.blog h2 {}
.page_blog #pm .art.blog img {}
.page_blog #pm .art.blog ul{}
.page_blog #pm .art.blog ul li{}
.page_blog #pm .art.blog ul li img{}
/*blog nav */
.blogBtns,
.blogPageBtns{}
.blogBtns a,
.blogPageBtns a{}
.blogBtns a.next,
.blogPageBtns a.next{}
.blogBtns a.prev,
.blogPageBtns a.prev{}
.blogBtns a.next::after,
.blogPageBtns a.next::after{}
.blogBtns a.prev::before,
.blogPageBtns a.prev::before{}

/* -------------------------------------------------------------------------------------
=OwlCarousel / Jquery Hacks 

It is expected that a separate file with the Jquery owl-carousel file, ONLY the overrides
should be listed here
------------------------------------------------------------------------------------- */

.carousel{
	margin-top: 2em;
	margin-bottom:1.875em;
}

.carousel:hover {
    cursor: -moz-grab;
    cursor: -webkit-grab;
    cursor: grab
}

.owl-carousel .owl-item img{
	height:auto;
}

.owl-theme .owl-controls{
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.owl-theme .owl-nav {
    text-align: center;
    -webkit-tap-highlight-color: transparent;
    position:absolute;
    width:100%;
    top:50%;
}

.owl-prev{
    position:absolute;
    left:1.5em;
    z-index:9999999;
}

.owl-next{
    position:absolute;
    right:1.5em;
}

.owl-prev,
.owl-next {
    color: #FFF;
    font-size: 1.5em;
    margin: .5em;
    padding: .5em;
    display: inline-block;
    cursor: pointer;
    border-radius: 3px;
    font-weight:800;
    pointer-events:initial;
}
.owl-prev:hover,
.owl-next:hover {
    background: #a1c327;
    color: #FFF;
    text-decoration: none; 
}

.disabled {
    opacity: 0.5;
    cursor: default;
}

.owl-theme .owl-nav.disabled + .owl-dots {
}

.owl-dots {
    position:absolute;
    bottom: 1em;
    right:1em;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
    width:100%;
}

.owl-dot {
    display: inline-block;
    pointer-events:initial;
}

.owl-dot span {
    width: .5em;
    height: .5em;
    margin: .5em;
    background: transparent;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 50%;
    border:2px #fff solid;
}

.owl-dot.active span,
.owl-dot:hover span {
    border:2px #a1c327 solid;
    background-color:#a1c327;
}


/* product carousels */

/* for product carousels remove the bottom padding on .fprd */
.owl-item .fprd{
    margin-bottom:0;
    width:100%;
}


.carousel div[id^="product"] .owl-dots{
	bottom:-2em;

}

.carousel div[id^="product"].owl-theme .owl-dots .owl-dot span {
    border:2px #605e5d solid;
}



/* -------------------------------------------------------------------------------------
=Jquery Base Overrides 
------------------------------------------------------------------------------------- */
.ui-dialog,
.ui-widget.ui-widget-content{
	background-color:#fff;
	z-index:2000;
	/* padding:1em; */
	border:1px #5b5e6b solid;
	border-radius:0px;
}

.ui-dialog .ui-dialog-titlebar {
	padding: 0;
	position: relative;

}

.ui-widget{
	font-size:1em;
	font-family: "urw-form",sans-serif;
}

.ui-widget-header{
	background-color:#eeeff1;
	border:none;
	color:#5b5e6b ;
}

.ui-dialog input{
	width:100%;
}

.ui-dialog input#subscribe{
	width:auto;
}

.ui-dialog input.submit{
	margin:.5em 0;
	text-align:center;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus{}

.ui-widget form{}

.ui-widget input[type="text"],
.ui-widget select,
.ui-widget textarea,
.ui-widget button{
	padding:0 .5em;
	padding:.25em 0.5em;
	padding:.5em;
	border:none;
	outline:1px #5b5e6b solid;
	max-width:320px;
}

.ui-dialog{
    width:600px !important;
}

.ui-dialog.ui-resizable{
	/*because things are added without thought, we have some popup message but we don't set classes
	this popup message likes to state the width and however it calculates this is not what we want...
	so we specify the width to fix one thing and that breaks another
	this SHOULD be the "ask a question" but it could also affect other stuff
	needs fixing in the source code, this is the best I can do */

	width:400px !important;
}

.ui-widget-content .art{
	/*testing this out */
	display:inline-block;
	width:100%;
}

.validateTips{
	font-size:.688em;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
/* We use html here because we need a greater specificity to make sure disabled
works properly when clicked or hovered */
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active{
	font-size:0.750em;
	padding:.5em;
	font-weight:600;
	
	cursor:pointer;
	background-color:#5b5e6b;
	border:1px #5b5e6b solid;
	outline:none;
	color:#fff;
	display:inline-block;
	vertical-align:middle;
	border-radius:0;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus{}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button{
	color:#454545;
	text-decoration:none;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus{
	color:#2b2b2b;
	text-decoration:none;
}


/* -------------------------------------------------------------------------------------
=Hacks 
------------------------------------------------------------------------------------- */
.clearfix{
	padding:0 !important;
	margin:0 !important;
	float:none !important;
    clear:both !important;
}

.spacer{
	float:left;	
}

.epau .bc{
    display:none;
}

#modal-overlay-inline{
    z-index:999;
}


/* tipsy */
.tipsy{
	padding: 5px;
	font-size: 12px;
	opacity: 0.8;
	filter: alpha(opacity=80);
	background-repeat: no-repeat;
	background-image: url(/images/tipsy.gif);
}

.tipsy-inner{
	padding: 5px 8px 4px 8px;
	background-color: black;
	color: white;
	max-width: 200px;
	text-align: center;
}

.tipsy-inner{
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

.tipsy-north{
	background-position: top center;
}

.tipsy-south{
	background-position: bottom center;
}

.tipsy-east{
    background-position: right center;
}

.tipsy-west{
	background-position: left center;
}



/* -------------------------------------------------------------------------------------
=ConfirmationPage 
------------------------------------------------------------------------------------- */
.page_confirmation .conf{

}
.page_confirmation .conf a.btn{
	display:inline-block;
	position:relative;
	width: 330px;
	margin-right:600px;
	margin-top:1em;
	padding: 13px 0;
	border:none;
	border-radius:1em;
	font-weight:600;
	font-size: 16px;
}


.page_confirmation .conf a.btn:before{
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	margin-right: .5em;
	font-size: 1.5em;
	display:inline-block;
	position:absolute;
	left: 0.7em;
	top: 0.3em;
}

/*iwoca*/
.page_confirmation .conf a.btn:before{
	content: '\f53a';
}

.page_confirmation .conf .info li{
	margin-bottom:1em;

}

.page_confirmation .conf .info li.info li{
	list-style:disc;
	list-style-position:inside;
}

.page_confirmation .conf .header{
	font-weight:600;
	font-size:2em;
}

.page_confirmation .conf .subhead{
	font-weight:600;
	margin:.5em 0;
}

/* custom form for ecatering */

.page_confirmation #pm .conf .form  form li label {
    float: left;
    margin-right:1em;
    min-width: 401px;
}
.page_confirmation  #pm .form .bc ul li label img,
.page_confirmation  #pm .form .bc ul li label p {
	display:inline-block;
	vertical-align:top;
}

/* Basket Line items
------------------------------------------------------- */
.page_confirmation .conf  .order{
}


.page_confirmation .conf .order .line{
	display:grid;
	grid-gap:.5em;
	grid-template-columns: 1fr 6fr 1fr 1fr;
	padding:1em;
	align-self:center;
	align-items:start;
}

.page_confirmation .conf .order .line:nth-child(odd){
	background-color:#f8f8f8;
}

/* Image */
.page_confirmation .conf .order .line a.img{}

/* Product title*/
.page_confirmation .conf .order .line .descr{
	align-self:start;
	font-size:.875em;
	font-weight:600;
}

.page_confirmation .conf .order .line .price {
	text-align:right;
	font-weight:600;
	align-self:start;
}

/* Basket Subtotal
------------------------------------------------------- */
.page_confirmation .conf .order .subtotal{
    padding:1em;
    border-top:1px #1d1d1d solid;
    text-align:right;
}

.page_confirmation .conf .order .subtotal label{
	margin-right: 1em;
}

.page_confirmation .conf .order .subtotal span{
	font-size:1.2em;
	font-weight:600;
}

.page_confirmation .conf .order .address{
	text-align:left;
	font-size:.875em;
}

/* Post order customer registration panel
------------------------------------------------------- */

.page_confirmation .conf .ordreg{
	background-color:#fff;
	padding:1em;
	margin:1em 0;
}

.page_confirmation .conf .ordreg input{
	margin:.5em 0;
}

.page_confirmation .conf .ordreg .info{
	margin:.5em 0;
}

.page_confirmation .conf .ordreg .help{
	font-size:.725em;
	padding:1em 0
}
/* ------------------------------------------------------------------------------------
        SCREEN - Doors and Fittings 2017
        3768320 : 4816896
        Filename : jquery_menu.css
        Last Updated : 24. 08. 2017
        Copyright : (c) 2017 Etail Systems Ltd
        Author : Etail Systems Ltd
        Web : http://www.etailsystems.com
		
	Table of Contents
		01.	=Tabs   
		02. =Dropdown   
		03. =Hacks

		Colors Used;
		Dark-Grey #605e5e
		light-Grey #eeecec
		AlmostBlack #0d0d0d
		Offer/Alert-Red #d94927
		
	
------------------------------------------------------------------------------------- */

#pt  .dept{
    display:inline-block;
    vertical-align:top;
    color:#fff;
    position: relative;
    width:100%;
    background-color:#8d8d99; 
}

#pt  .dept .bt,
#pt  .dept .bb{
    display: none;
}

#pt  .dept .bc{
	width:100%;
	text-align:center;
    background-color: transparent;
}

#pt .dept ul#jnav{
    display:inline-block;
    padding: 0;
    list-style-type: none;
    list-style-position: outside;
    position: relative;
    z-index: 1001;
    width:100%;
}

#pt .dept ul#jnav li{
    display:inline-block;
}
#pt .dept ul#jnav li.nav:first-child,
#pt .dept ul#jnav li.navcurr:first-child{
	font-weight:600;
}

#pt .dept ul#jnav li.nav:after,
#pt .dept ul#jnav li.navcurr:after{}

#pt  .dept ul#jnav li.nav:last-child::after{
	content:"";
}

#pt  #jnav li{
    padding: 0px 0px;
}

#pt  #jnav li.pipe{
}


/***********************************************************************/
/* =Tabs                                                                */
/***********************************************************************/

#pt  #jnav li.nav a,
#pt  #jnav li.navcurr a {
	text-align: center;
	font-weight:600;
	font-size: 1.125em;
	display: inline-block;
	text-decoration: none;
	padding: 1em 1.5em;
	/* margin:0 .5em; */
}

#pt  #jnav li.nav a:hover,
#pt  #jnav li.navcurr a:hover{
	background-color:#f3f4f6;
	color:#3d4146;
	text-decoration:underline;
}

#pt  #jnav li.nav:hover,
#pt  #jnav li.navcurr:hover {
}

#pt  #jnav li.navcurr a:hover {}

#pt  #jnav .navleft,
#pt  #jnav .navright,
#pt  #jnav .navleftcurr,
#pt  #jnav .navrightcurr{
    display: none;
}

/***********************************************************************/
/* =Dropdown                                                           */
/***********************************************************************/
#pt  #jnav li.nav ul.snav,
#pt  #jnav li.navcurr ul.snav{
    position: absolute;
    background-color:#f3f4f6;
    text-align:center;
    display: none;
    padding: 0;
    -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    width: 240px;
    margin:0;
}


#pt  #jnav li.nav ul.snav li,
#pt  #jnav li.navcurr ul.snav li{
    position: relative;
    display: inline-block;
    margin: 0;
    vertical-align:middle;
    width: calc(100% - 1em);
    margin:.5em;
    border-bottom:1px #3d4146 solid;
    padding-bottom:.5em;
}

#pt  #jnav li.nav ul.snav li:last-child,
#pt  #jnav li.navcurr ul.snav li:last-child
{
	border:none;
}


/***********************************************************************/
/* =Slide out from dropdown                                            */
/***********************************************************************/
#jnav li.navcurr ul.snav li ul.snav,
#jnav li.nav ul.snav li ul.snav{}

#pt  #jnav li.nav ul.snav li.depts,
#pt  #jnav li.navcurr ul.snav li.depts{}

#pt  #jnav li.nav ul.snav li a,
#pt  #jnav li.navcurr ul.snav li a{
	font-size:1em;
	font-family:inherit;
	text-transform:none;
	display:inline-block;
	vertical-align:middle;
	text-align:left;
	color:#090909;
}

#pt  #jnav li.nav ul.snav li a.deptIcon,
#pt  #jnav li.navcurr ul.snav li a.deptIcon{
	display:inline-block;
	vertical-align:middle;
	margin:0;
	padding:0 1em;
	width:60px;
	height:60px;
	display:table-cell;
}

#pt  #jnav li.nav ul.snav li a.deptIcon img,
#pt  #jnav li.navcurr ul.snav li a.deptIcon img{
	vertical-align:middle;
	/* width:60px !important; */
	/* height:60px !important; */
	margin:auto;
}

#pt  #jnav li.nav ul.snav li a.deptLink,
#pt  #jnav li.navcurr ul.snav li a.deptLink{
	display:table-cell;
	vertical-align:middle;
	margin:0;
	padding:0;
	max-width:calc(100% - 60px);
	word-wrap: break-word;
}

#pt  #jnav li.nav ul.snav li a:hover,
#jnav li.navcurr ul.snav li a:hover{
	text-decoration: underline;
	text-decoration-color:#383838
}

/* Banners */
#pt  #jnav li.nav ul.snav li.bnrs,
#pt  #jnav li.navcurr ul.snav li.bnrs{}

#pt  #jnav li.nav ul.snav li.bnrs .bnr,
#pt  #jnav li.navcurr ul.snav li.bnrs .bnr{}

#pt  #jnav li.nav ul.snav li.bnrs .bnr a,
#pt  #jnav li.navcurr ul.snav li.bnrs .bnr a{}

/* Level 1 dept header */
#pt  #jnav li.nav ul.snav li.depts a,
#pt  #jnav li.navcurr ul.snav li.depts a{
	width:auto;
}

#pt  #jnav li.nav ul.snav li.depts a.l1,
#pt  #jnav li.navcurr ul.snav li.depts a.l1{
	/*remove the padding that is inherited from the top level tabs */
	padding:0;
	color:#343d46;
}

#pt  #jnav li.nav ul.snav li.depts a.l1:hover,
#pt  #jnav li.navcurr ul.snav li.depts a.l1:hover{
	text-decoration-color:#2c1a30;
}

/* Level 2 depts */
#pt  #jnav li.nav ul.snav li a.l2,
#pt  #jnav li.navcurr ul.snav li a.l2{
	font-size:1em;
	color:#2c1a30;
	font-family: 'Playfair Display';
	/*remove the padding that is inherited from the top level tabs */
	padding:0;
}

#pt  #jnav li.nav ul.snav li a.l2:hover,
#pt  #jnav li.navcurr ul.snav li a.l2:hover{
	text-decoration-color:#343d46;
}

#pt  #jnav li.nav ul.snav li.depts a:hover,
#pt  #jnav li.navcurr ul.snav li.depts a:hover{}

#pt  #jnav li.nav ul.snav li.depts a.seeall{
    cursor:pointer;
}

#pt  #jnav li.nav ul.snav li.depts a.seeall:hover{}

#pt  .dept .bt,
#pt  .dept .bb{}

#pt  .dept ul{
    list-style-type: none;
    position: relative;
}

#pt  #jnav li:first-child {}
#pt  #jnav li:last-child {}

#pt  #jnav li.nav ul.snav li,
#pt  #jnav li.navcurr ul.snav li{
    vertical-align:top;
}

#pt  #jnav li.nav ul.snav li.alldepts,
#pt  #jnav li.navcurr ul.snav li.alldepts{}

#pt  li.alldepts ol{
    /*depts are in ol not ul */
    list-style-position:inside;
}

#pt  #jnav li.nav ul.snav li.alldepts li.depts,
#pt  #jnav li.navcurr ul.snav li.alldepts li.depts{
    display:inline-block;
    list-style-position:inside;
    margin:0;
    padding:0;
    text-align:left;
    height: auto;
}

#pt  #jnav li.nav ul.snav li.prods,
#pt  #jnav li.navcurr ul.snav li.prods{
    /*may need to sort out other widths as .fprd is set elsewhere */
}

#pt  #jnav li.nav ul.snav li.prods .fprd {}
#pt  #jnav li.nav ul.snav li.prods .fprd a {}
#pt  #jnav li.nav ul.snav li.prods .fprd a:hover {}
#pt  #jnav li.nav ul.snav li.prods .fprd .fprdtitle a {}
#pt  #jnav li.nav ul.snav li.prods .fprd .fprdtitle a:hover {}
#pt  #jnav li.nav ul.snav li.prods .fprd h5.clientref {}
#pt  #jnav li.nav ul.snav li.prods .fprd .packsize {}
#pt  #jnav li.nav ul.snav li.prods .fprd .price {}
#pt  #jnav li.nav ul.snav li.prods .fprd .price h6 {}
#pt  #jnav li.nav ul.snav li.prods .fprd form {}

#pt  #jnav li.nav ul.snav li.arts,
#pt  #jnav li.navcurr ul.snav li.arts {
    display: inline;
    width:initial;
    height:auto;
}

#pt  #jnav li.nav ul.snav li.arts a,
#pt  #jnav li.navcurr ul.snav li.arts a{
}

#pt  #jnav li.nav ul.snav li.arts a img,
#pt  #jnav li.navcurr ul.snav li.arts a img{
	display:block;
}

#pt  #jnav .art.menuArt {}
#pt  #jnav li.nav ul.snav li.arts h3{}
#pt  #jnav .art.menuArt p {}
/* ------------------------------------------------------------------------------------
        SCREEN - Doors and Fittings 2020
        3768320 : 4816896
	Filename : product.css
	Last Updated : 19. 06. 2020
	Copyright : (c) 2020 Etail Systems Ltd
	Author : Etail Systems Ltd
	Web : http://www.etailsystems.com
		
Table of Contents
    01.	=Product Panels   
    02. =Typography 
    03. =Tab Panel 
    04. =Imagery 
    05. =Buy pane  
    06. =Buy pane form  
    07. =Super Attributes 
    08. =Associated and Related products  
    09. =Recommended products - Buy option 
    10. =buytogether
    11. =Flags / Files
    12. =Videos 
    13. =Wishlist
    14. =Social bookmarks pane   
    15. =Feefo 
    16. =Hacks

------------------------------------------------------------------------------------- */



/* -------------------------------------------------------------------------------------
=Product Panels   
------------------------------------------------------------------------------------- */

#pi{
    float: left;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}

#pi .top{
    position:absolute;
    top:0;
    right:0;
    width:200px;
    z-index:1000;
}

#pi .main{
    float:left;
    width: 100%;
    margin-right:1em;
    position:relative;
}

#pi .left{
    float: left;
    width: 524px;
    margin-right: 2em;
    padding: 0;
}

#pi .right{
    float: left;
    position: relative;
    width: 644px;
    padding: 0;
}

#pi .bottom{
   display:inline-block;
   /* text-align:center; */
   width:100%;
   margin-top:1em;
   /* border-top:1px #eeecec solid; */
}
/* -------------------------------------------------------------------------------------
=Typography 
------------------------------------------------------------------------------------- */

/* Title
------------------------------------------------------- */

#pi .pititle{
	width: 428px;
	float:left;
	clear:both;
	margin-right:1em;
}
#pi .pititle h2{
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
    color:#0d0d0d;
}

/* Description panes 
------------------------------------------------------- */

#pi .delivery{
	display:inline-block;
	border-top:1px #e3e3e3  solid;

	padding-top:.5em;
	
}


#pi .pidesc{
    float:left;
    width:calc(100% - 2em - 2px);
    /*removed the below because pidesc is writen out regardless of whether the product has any data entered against it */
    /* border:1px #d9e1e6 solid; */
    /* padding:1em; */
    /* -webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75); */
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    /* box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75); */
}

#pi .pidesc h2[itemprop="name"],
#pi .pidesc h4[itemprop="description"]{
	display:none;
}
#pi .delivery h3{
	display:none;
}
#pi .pidesc p,  
#pi .delivery p{}
#pi .pidesc ul{}
#pi .pidesc li{}


/* direct despatch */
#pi .pidesc.desp h5{
	/* display:none; */
	font-size:0.938em;
	display:inline;
	color:#66666e;
}
#pi .pidesc.desp p{
	display:inline;
    font-size: 0.938em;
    color: #949498;
}

/* Extra Description 
------------------------------------------------------- */
#pi .pidescx{
	width:100%;

	float:left;
	border-bottom:2px #eef2f3 solid;
	padding-bottom:1em;
	margin-bottom:.5em;
}

/*because of the insistance of using inline styles!*/
#pi .pidescx ul{
    list-style-type:none !important;
    font-size:initial !Important;
    margin-left:0 !Important;
}


#pi .pidescx ul li{
   list-style: none;
   line-height:1;
   font-size: 1em;
}

/* Brand and Manufacturer  
------------------------------------------------------- */

#pi .brandmanu.brand{
	width: 428px;
	float:left;
	clear:both;
	margin-right:1em;
	margin-bottom:1em;
	text-transform:uppercase;
}

#pi .brandmanu.brand a{
	display:block;
	color:#49708b;
	font-size:0.875em;
}


#pi .brandmanu.brand img{
}

#pi .brandmanu.model{
	/* text-transform:uppercase; */
}

#pi .brandmanu h5{}
#pi .brandmanu h6{}
#pi .brandmanu p,
#pi .brandmanu a{}
#pi .brandmanu.brand h5{
    display: none;
}





#pi .brandmanu.model{
	width: 428px;
	float:left;
	clear:both;
	margin-right:1em;
	margin-bottom:1em;
	/* text-transform:uppercase; */
}
#pi .brandmanu.clientref{
	width: 428px;
	float:left;
	clear:both;
	margin-right:1em;
	margin-bottom:1em;
	/* text-transform:uppercase; */
}


#pi .brandmanu.model h5,
#pi .brandmanu.clientref h5{
	display:inline-block;
	width:100px;
	vertical-align:middle;
	color:#49708b;
	font-size:0.875em;
	margin-right:1em;
}

#pi .brandmanu.model h6,
#pi .brandmanu.clientref h6{
	display:inline-block;
	vertical-align:middle;
	font-size:0.875em;
	font-weight:normal;
}


/* Telephone orders   
------------------------------------------------------- */

#pi .piphone{}
#pi .piphone h4{}
#pi .piphone h5{}
#pi .piphone p{}



/* -------------------------------------------------------------------------------------
=Tab Panel 
------------------------------------------------------------------------------------- */

#pm #pi #pi_wrapper{
    float:left;
    width:100%;
	-webkit-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    -moz-box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
    box-shadow: -2px 2px 2px 0 rgba(96,94,93,0.75);
}

#pm #pi ul.pi_tabs{
    display:inline-block;
    float:left;
    width:100%;
    cursor:pointer;
}

#pm #pi ul.pi_tabs li{
    float:left;
    font-size:1em;
    font-weight:600;
    padding: 1em;
    margin-right: 0.25em;
    text-align:center;
    border:1px #ebecee solid;
    background-color:#ebecee;
}

#pm #pi ul.pi_tabs li.selected{
	border:1px #d9e1e6 solid;
	border-bottom: 1px #fff solid;
	background-color:#fff;
	color:#0d0d0d;
	z-index:99999999;
	font-weight:600;
}
#pm #pi ul.pi_tabs li:last-child{}

#pm #pi .pi_tab_content{
    float:left;
    width: 610px;
    min-height: 140px;
    padding: 0 1em;
    /*overflow-y:scroll;
    overflow-x:hidden;*/
    border:1px #d9e1e6 solid;
    /* border-bottom:none;*/
}

#pm #pi .pi_tab_content h2{
    font-size:1.2em;
}
#pm #pi .pi_tab_content h3,
#pm #pi .pi_tab_content h4,
#pm #pi .pi_tab_content ul{
    
}
#pm #pi .pi_tab_content p{
	padding:.5em 0;
	font-size:0.938em;
}
#pm #pi .pi_tab_content a{}
#pm #pi .pi_tab_content a img {}

#pm #pi .pi_tab_content ul ,
#pm #pi .pi_tab_content ol{
	margin:1em 2em;
}
#pm #pi .pi_tab_content ul li,
#pm #pi .pi_tab_content ol li{

}

#pm #pi .pi_tab_content ul li{
    list-style: disc;
    font-size:0.938em;
}

/* -------------------------------------------------------------------------------------
=Imagery 
------------------------------------------------------------------------------------- */

#pi .piimg{
    border: solid 1px #dbdfe1;
}
#pi .piimg img{
	margin:0 !important;
}



#pi .piimg p{
    display: none;
}

#pi .piimgx{}

/* If image not aligning centrally */
#pi .piimg a{
    float: none;
    margin-left: auto;
    margin-right: auto;
}

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

#pi .gallery{
    float:left;
    width:100%;
    text-align:left;
    margin:.5em 0;
}

#pi .gallery h4{
    display: none;
}

#pi .gallery .piimg_large{
    width:83px;
    display:inline-block;
    margin:1em;
}

#pi .gallery .piimg_large img{
    width:100%;
    height:auto;
}
#pi .gallery .piimg_large a{}

/* Main Image Zoom
------------------------------------------------------- */

/* This is the moving lens square underneath the mouse pointer. */
.cloud-zoom-lens{
    border: 1px solid #888;
    margin: -2px; /* Set this to minus the border thickness. */
    background-color: #fff;
    cursor: move;
}

/* This is for the title text. */
.cloud-zoom-title{
}

/* This is the zoom window. */
.cloud-zoom-big{
    border: 1px solid #ccc;
    overflow: hidden;
    margin-top: -1px;
    margin-left: -7px;
    background-color:#fff;
}

/* This is the loading message. */
.cloud-zoom-loading{
    position: absolute;
    top: 0;
    margin: 0;
    color: white;
    background: #222;
    padding: 3px;
}
   
/* -------------------------------------------------------------------------------------
=Buy pane  
------------------------------------------------------------------------------------- */

#pi .pibuy{
	width: 100%;
	display:inline-block;
	vertical-align:bottom;
	/* padding-top:1em; */
	margin-bottom: 1em;
}

#pi .pibuy h6{
	font-family: 'Open Sans', sans-serif;
}
#pi .pibuy .bt{}
#pi .pibuy .bc{}
#pi .pibuy .bb{}

#pi .pibuy .bc .title{
    display:none;
}

/* pricing info
------------------------------------------------------- */
#pi .pibuy .bc .price,
#pi .pibuy .bc .offer,
#pi .pibuy .bc .prevprice,
#pi .pibuy .bc .rrp,
#pi .pibuy .bc .trade,
#pi .pibuy .bc .saving{
	display:inline-block;
	margin-right:1em;
}

/*normal price */
#pi .pibuy .bc .price {
	display:none;
}
#pi .pibuy .bc .price h6{
    color:#4b738e;
    font-size:1.5em;
} 
#pi .pibuy .bc .price label{
    display:none;
}
#pi .pibuy .bc .price span{} 

/*rrp price */
#pi .pibuy .bc.rrp {}
#pi .pibuy .bc .rrp h6{}
#pi .pibuy .bc .rrp label{}
#pi .pibuy .bc .rrp span{} 

/*offer price */
#pi .pibuy .bc .offer {
	color:#d94927;
	}
#pi .pibuy .bc .offer h6{}
#pi .pibuy .bc .offer label{} 
#pi .pibuy .bc .offer span{} 

/*previous price (goes with offer) */
#pi .pibuy .bc .prevprice {
	color:#4b738e;
}
#pi .pibuy .bc .prevprice h6{
	text-decoration: line-through;
	text-decoration-color:#d94927;
}
#pi .pibuy .bc .prevprice label{}
#pi .pibuy .bc .prevprice span{} 

/*offer price */
#pi .pibuy .bc .saving {
	color:#a1c327;
}
#pi .pibuy .bc .saving h6{}
#pi .pibuy .bc .saving label{}
#pi .pibuy .bc .saving span{}  

/*trade price */
#pi .pibuy .bc .trade {}
#pi .pibuy .bc .trade h6{}
#pi .pibuy .bc .trade label{}
#pi .pibuy .bc .trade span{} 

/* Messages */
#pi .pibuy p{}
#pi .pibuy h4{}
#pi .pibuy h5{}
#pi .pibuy p.p_stock{}


/* stock */
#pi .pibuy .stock{
    font-size:.8em;
}


/* -------------------------------------------------------------------------------------
=Buy pane form  
------------------------------------------------------------------------------------- */

#pi .pibuy form#buy_form{
    float:left;
    width:100%;
    margin-top:1em;

}
/*to do with the next day doors*/
#pi .pibuy form#buy_form div.attr,
#pi .pibuy form#buy_form div.attrqty{
	/* display:inline-block; */
	/* vertical-align:middle; */
	/* margin-top: 1.5em; */
	/* position:relative; */
}

#pi .pibuy form#buy_form div.attr .qtyinput,
#pi .pibuy form#buy_form div.attrqty .qtyinput{
	display:inline-block;
	vertical-align:middle;
}
/* quantity input */
.attrqty .qtyinput{
	display:inline-block;
	vertical-align:middle;
	margin:.5em;
}

/*hide quantity label*/
.attrqty .qtyinput label{
	display:none;
}
.attrqty .qtyinput #skuqty{
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	padding:.5em;
	/* margin:.5em; */
}

/*increase/decrease buttons */
.attrqty .qtyinput  button{
	display:inline-block;
	vertical-align:middle;
	border:1px #735e5d solid;
	color:#735e5d;
	font-weight:600;
	font-size:1.3em;
	padding:.25em .5em;
	background-color:#fff;
	cursor:pointer;
}

.attrqty .submit{
	/* outline:1px red solid; */
	height: 36px;
	display:inline-block;
	vertical-align:middle;
	font-size:1em;
	padding:0;
	border: none;
	text-align: center;
	border-color:inherit;
	cursor:pointer;
	border:none;
}


#selectResponse{
	position:absolute;
	top: -1.5em;
	left:0;
	font-size:.813em;
	font-weight:600;
	color:red;
}

#pi .pibuy form#buy_form div.attr .attritem{}
#pi .pibuy form#buy_form div.attr .attritem .multiselect{}
#pi .pibuy form label{}

.sa_validator /* Shouldn't be visible. AL */
{
    display: none;
}


/* to do with the next day doors and html structure */
#buy_form .fixedpane.initial label{
	display:inline-block;
	font-weight:600;
	padding: 1em .5em;
	background-color:#f3f4f6;
	width:calc(100% - 1em);
}
#buy_form .fixedpane.initial select{
	margin-left:.5em;
}



#pi .pibuy form div.attr label{
}
#pi .pibuy form div.attrqty label{
    display:none;
}
#pi .pibuy form div.attr label#selectResponse{}
#pi .pibuy form input,
#pi .pibuy form select,
#pi .pibuy form textarea{}
#pi .pibuy form select{
	margin:1em;
	margin-left:0;
}
#pi .pibuy form .inputtext,
#pi .pibuy form .textarea{}
#pi .pibuy span.chars{
	font-size:.8em;
}
#pi .pibuy .submit{
    font-weight:600;
    font-size:0.75em;
    padding:0.8em 1em;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:.5em;
    color:#fff;
    border:1px #a1c327 solid;
    background-color:#a1c327;
}

#pi .pibuy .submit#smplreq{
	margin-left:1em;
    font-weight:600;
    font-size:0.75em;
    padding:0.8em 1em;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:.5em;
    color:#605e5d;
    border:1px #ebecee solid;
    background-color:#ebecee;
}


#pi .pibuy .submit:hover{
	color:#a1c327;
	background-color:transparent;
	text-decoration:none;
	border:1px #a1c327 solid;
}

#pi .pibuy #bspsubmit.submit{}

#pi .pibuy .curr{
    display:none;
}

#pi .dynprice{
	/* position:absolute; */
	/* right: 116px; */
	/* bottom: 389px; */
	margin-bottom:1em;
	}

#pi .dynprice p{
	color:#4b738e;
	font-size:1.5em;
	font-weight:600;
}

/* Product Personalisation info
------------------------------------------------------- */
#pi .pibuy form .pers{
	background-color:#eef2f3;
	padding:.5em;
	margin-bottom:1em;
}


#pi .pibuy form .pers li{
	margin-bottom:.5em;
}
#pi .pibuy form .pers li:last-child{
	margin-bottom:0;
}

#pi .pibuy form .pers label{
	width:100px;
	display:inline-block;
}
#pi .pibuy form .pers input.inputtext{
	width:270px;
	margin-right:.5em;
}


#pi .pibuy form .pers span.chars{

}

#pi .pibuy form .pers span{
		font-size:.8em;
}

/* -------------------------------------------------------------------------------------
=Super Attributes    
------------------------------------------------------------------------------------- */

#buy_form .fixedheader,
#buy_form .header{
	font-weight:600;
	padding: 1em .5em;
	background-color:#f3f4f6;
}


/*hack to do with a blank field - see made to measure doors */
#buy_form .fixedheader.initial{
	background:none;
	padding:0;
}

#buy_form .fixedpane{
	/*so we can position the help icon */
	position:relative;
	/* padding:1em; */
	border:1px #f3f4f6 solid;
	border-top:0;
}

#sa_pnl_product_not_found{
	display:none;
}

#pi .pibuy form#buy_form .cls_superattrribute label.sa_name {
	/*bit of a problem here, due to the way the code is written out, 
	hiding this also hides a help icon that may be wanted
	code improvement needed if help icons are needed to be shown*/
}

#pi .pibuy form#buy_form .cls_superattrribute{
	/* margin-bottom:1em; */
	position:relative;
	padding: 1em;
	margin:0;
}

#pi .pibuy form#buy_form .cls_superattrribute .bc table{}
#pi .pibuy form#buy_form .cls_superattrribute .bc table .sa_left_cell_type_1,
#pi .pibuy form#buy_form .cls_superattrribute .bc table .sa_right_cell_type_1{}

#pi .pibuy form#buy_form .cls_superattrribute label.sa_name{
	font-weight:600;
	display:none; /* because we double stuff up in the width/height bit for doors/drawers */
}

#pi .pibuy form#buy_form .cls_superattrribute .att_X,
#pi .pibuy form#buy_form .cls_superattrribute .att_Y{
	display:inline-block;
	/* width: 50%; */
	/* margin:0.5em; */
	margin-left:0;
}

#pi .pibuy form#buy_form .cls_superattrribute .att_X label,
#pi .pibuy form#buy_form .cls_superattrribute .att_Y label{
	/* min-width: 100px; */
	display:inline-block;
	margin-right:1em;
	margin-bottom:.4em;
	font-weight:600;
}


#pi .pibuy form#buy_form .cls_superattrribute .calc_price{
	display:inline-block;
	vertical-align:middle;
	margin:0.5em;
	/* filter:invert(100); */
}

.sa_right_cell_type_5 div{
	display:inline-block;
}

.sa_validator{
	color:red;
	font-size:.813em;
	font-weight:600;
}

#pi .pibuy form#buy_form .cls_superattrribute .submit{
    font-weight:normal;
    font-size:1em;
    padding:0;
    border: none;
    text-align: center;
    text-transform: uppercase;
    border-color:inherit;
    cursor:pointer;
    border-radius:0;
    color:#000;
    border:none;
    background-color:transparent;
}

#pi .cls_superattrribute .inputtext_short{
    width: 100px;
    padding: 2px;
}

#pi .cls_superattrribute .sa_error{
	vertical-align:top;
}



#pi .pibuy form#buy_form .attributeTypePrice_Matrix_Calculator {
	background-color:#f2f9f9;
	padding:1em;
}

#pi .pibuy form#buy_form .attributeTypeRadio_button li {
	display:inline-block;
	/* margin-right: 1em; */
}


#pi .pibuy form#buy_form .attributeTypeRadio_button li ul  .radioholder img{
	display:inline-block;
	vertical-align:middle;
	margin:.25em;
	max-width:64px;
	height:auto	;
}

#pi .pibuy form#buy_form .cls_superattrribute img[id^="help"]{
	position:absolute;
	top: 0.5em;
	right: 0.5em;
}

/* specifics
------------------------------------------------------- */

/*attributeTypeVolume_Surface_Calculator
***************************************************************/
.cls_superattrribute.attributeTypeVolume_Surface_Calculator  {
	width:100%;
	/* border-bottom:1px #e3e3e3 solid; */
}

.cls_superattrribute.attributeTypeVolume_Surface_Calculator {
}

.cls_superattrribute.attributeTypeVolume_Surface_Calculator   .info.sa_name{
	/* display:none; */
	position:relative;
	left:-1em;
}

/*help icon needs to be placed differently for different items... */
.cls_superattrribute.attributeTypeVolume_Surface_Calculator    img[id^="help"]{
	position:absolute;
	display:inline-block;
	vertical-align:middle;
	right: .5em;
}

.cls_superattrribute.attributeTypeVolume_Surface_Calculator   .sa_ddl_content{
	display:inline-block;
	width:50%;
}

.volcalcdatavalli{
	width:100%;
	margin:1em 0;
}

.volcalcvalue{
	display:inline-block;
	vertical-align:middle;
	margin-right:1em;
	text-align:right;
	min-width: 1.6em;
	margin-bottom:1em;
	text-align:center;
}

#pi .pibuy form .volcalcvalue label{
	margin:0;
	font-weight:600;
}

.volcalcinput{
		display:inline-block;
		vertical-align:middle;
		margin-right: 0.5em;
		margin-bottom:1em;
}

.volcalcinput input{
	/* outline:1px red solid; */
	/* width: 152px; */
}

#pm .bc ul.accordion li.volcacldata{
	display:none;
}

/* attributeTypePrice_Matrix_Calculator 
***************************************************************/
.cls_superattrribute.attributeTypePrice_Matrix_Calculator {
	background-color:#f7f9f9;
	width:calc(100% - 2em);
	margin-bottom:1em;
}

.cls_superattrribute.attributeTypePrice_Matrix_Calculator .bc{
	padding:.5em;
}

/*help icon needs to be placed differently for differnt items... */
.cls_superattrribute.attributeTypePrice_Matrix_Calculator  #saten_pnl_show img[id^="help"]{
	position:absolute;
	right: 1em;
	top:1em;
}

.cls_superattrribute.attributeTypePrice_Matrix_Calculator  .att_X label,
.cls_superattrribute.attributeTypePrice_Matrix_Calculator  .att_Y label{
	width:100%;
	font-weight:400;
}

.cls_superattrribute.attributeTypePrice_Matrix_Calculator  label{
	font-weight:600;
}




/* attributeTypeDimensions 
***************************************************************/
.cls_superattrribute.attributeTypeDimensions {
	background-color:#f7f9f9;
	width:100%;
	margin-bottom:1em;
	position:relative;
}

.cls_superattrribute.attributeTypeDimensions .bc{
		padding:.5em;
}
	
.cls_superattrribute.attributeTypeDimensions .width{
	display:inline-block;
	width:100%;
	border-bottom:2px #fff solid;
	margin-bottom:1em;
	position:relative;
}

.cls_superattrribute.attributeTypeDimensions .drop{
	display:inline-block;
	width:100%;
	position:relative;
}

.cls_superattrribute.attributeTypeDimensions .width label,
.cls_superattrribute.attributeTypeDimensions .width input,
.cls_superattrribute.attributeTypeDimensions .drop label,
.cls_superattrribute.attributeTypeDimensions .drop input{

	display:inline-block;
	vertical-align:middle;
	float:none;
	margin-bottom:1em;
	width:200px;
	margin-right:1em;
	font-weight:400 !important;;
}

/* due to lack of a decent structure... */
/* width */
.attributeTypeDimensions .width input:nth-of-type(1){
    position:absolute;
    left:0px;
    top:52px;
}

.attributeTypeDimensions .width label:nth-of-type(2){
    position:absolute;
    top:0;
    left: 216px;
}
.attributeTypeDimensions .width input:nth-of-type(2){
    position:absolute;
    top:52px;
    left:216px;
}

.attributeTypeDimensions .width label:nth-of-type(3){
    position:absolute;
    top:0;
    left: 433px;
}

.attributeTypeDimensions .width input:nth-of-type(3){
    position:absolute;
    top:52px;
    left: 433px;
}

/*drop */
.attributeTypeDimensions .drop input:nth-of-type(1){
    position:absolute;
    left:0px;
    top:52px;
}

.attributeTypeDimensions .drop label:nth-of-type(2){
    position:absolute;
    top:0;
    left: 216px;
}
.attributeTypeDimensions .drop input:nth-of-type(2){
    position:absolute;
    top:52px;
    left:216px;
}

.attributeTypeDimensions .drop label:nth-of-type(3){
    position:absolute;
    top:0;
    left: 433px;
}

.attributeTypeDimensions .drop input:nth-of-type(3){
    position:absolute;
    top:52px;
    left: 433px;
}


/*hide the unneeded character count */
.cls_superattrribute.attributeTypeDimensions .width span,
.cls_superattrribute.attributeTypeDimensions .drop span{
	display:none;
}

/*help icon needs to be placed differently for differnt items... */
.cls_superattrribute.attributeTypeDimensions  img[id^="help"]{
	position:absolute;
	right: 1em;
	top:1em;
}

.cls_superattrribute.attributeTypeDimensions  .att_container{
	padding:.5em;
}

.cls_superattrribute.attributeTypeDimensions  .att_X label,
.cls_superattrribute.attributeTypeDimensions  .att_Y label{
	width:100%;
}

.cls_superattrribute.attributeTypeDimensions  label{
	display:inline-block;
	width:100%;
	margin-bottom:1em;
	font-weight:600;
}

/* attributeTypeRadio_button
***************************************************************/
.cls_superattrribute.attributeTypeRadio_button {
	/* width:calc(100% - 1em); */
	/* border-bottom:1px #e3e3e3 solid; */
	padding:1em 0;
}

.cls_superattrribute.attributeTypeRadio_button  .info.sa_name{
	display:none;
}

/*help icon needs to be placed differently for differnt items... */
.cls_superattrribute.attributeTypeRadio_button   img[id^="help"]{
	position:absolute;
	display:inline-block;
	vertical-align:middle;
	right: .5em;
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali{
	display:inline-block;
	width:100%;
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali ul{
	display:inline-block;
	vertical-align:middle;
	width:100%;
	margin:0;
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali .radioholder{
	display:inline-block;
	vertical-align:middle;
	width:calc(50% - 1em);
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali .radioholder input{
	display:inline-block;
	vertical-align:middle;
	width:2em;
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali .radioholder label{
	display:inline-block;
	vertical-align:middle;
	width: calc(100% - 8em);
}

.cls_superattrribute.attributeTypeRadio_button  .radiobuttondatali .radioholder img{
	display:inline-block;
	vertical-align:middle;
	max-width:4em;
	height:auto;
}



/* attributeTypeText_Box_Free_Text_Entry 
***************************************************************/
.cls_superattrribute.attributeTypeText_Box_Free_Text_Entry {
	width:100%;
	border-bottom:1px #e3e3e3 solid;
	padding:1em 0;
	position:relative;
}

/*hackity hack from lack of decent structure... */

.cls_superattrribute.attributeTypeText_Box_Free_Text_Entry .bc div{
	display:inline-block;
}

.cls_superattrribute.attributeTypeText_Box_Free_Text_Entry  .sa_name{
	position:relative;
	width:326px;
	display:inline-block;
	vertical-align:middle;
}

/*help icon needs to be placed differently for differnt items... */
.cls_superattrribute.attributeTypeText_Box_Free_Text_Entry   img[id^="help"]{
	position:absolute;
	right: 334px;
	top: 27px;
	/* outline:1px blue solid; */
}

.cls_superattrribute.attributeTypeText_Box_Free_Text_Entry span{
	display:none;
}



/*attributeTypeDrop_down_list
***************************************************************/
.cls_superattrribute.attributeTypeDrop_down_list {
	width:100%;
	/* border-bottom:1px #e3e3e3 solid; */
	padding:1em 0;
}

.cls_superattrribute.attributeTypeDrop_down_list  .info.sa_name{
	position:relative;
	left:-1em;
}

/*help icon needs to be placed differently for differnt items... */
.cls_superattrribute.attributeTypeDrop_down_list   img[id^="help"]{
	position:absolute;
	display:inline-block;
	vertical-align:middle;
	right: .5em;
}

.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content{
	display:inline-block;
	width:50%;
}
/* for things with images... */

.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content .sa_swatch_panel{
/*except this isn't just written out when images are in use because people don't think! */
/*don't put stuff in here it breaks things you may not be seeing on other pages */
}

.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content .sa_swatch_panel .sa_swatch_panel_inner{
	display:inline-block;
	vertical-align:top;
	width: 25%;
	text-align:center;
	margin-right:1em;
}



img.sa_img_swatch_selected{
	outline:2px #5b5e6b solid;
}


.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content .sa_swatch_panel .sa_swatch_panel_inner img,
.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content .sa_swatch_panel .sa_swatch_panel_inner span{
	width:100%;
}

.cls_superattrribute.attributeTypeDrop_down_list  .sa_ddl_content select{
	width:100%;
}

/* whatever this is we don't want it! */
.sa_pnl_product_popup_image_show{
	outline:1px red solid;
	display:none !important;
}


/*attributeTypeSingle_Image_Upload 
***************************************************************/
.cls_superattrribute.attributeTypeSingle_Image_Upload {
	width:100%;
	border-bottom:1px #e3e3e3 solid;
	padding:1em 0;
}


/*hackity hack from lack of decent structure... */

.cls_superattrribute.attributeTypeSingle_Image_Upload .bc + div{
	display:inline-block;
}


.cls_superattrribute.attributeTypeSingle_Image_Upload .progress{
	width:100%;
}

.cls_superattrribute.attributeTypeSingle_Image_Upload .progress + div	{
	text-align:right;
}

.cls_superattrribute.attributeTypeSingle_Image_Upload  .sa_name{
	position:relative;
	width: 301px;
	display:inline-block;
	vertical-align:middle;
}

/* no idea why this is done like this.. radio options with images*/

.sa_pnl_product_popup_image_show{

}


/* -------------------------------------------------------------------------------------
=Associated and Related products  
------------------------------------------------------------------------------------- */
#pi .prec,
#pi .pass,
#pi .prel,
#pi .pran{
	display:inline-block;
	width:100%;
	text-align:center;
}

#pi .prec h3,
#pi .pass h3,
#pi .prel h3,
#pi .pran h3{
	text-align:center;

}

#pi .prec label,
#pi .pass label,
#pi .prel label,
#pi .pran label{
		max-width: 55px;
}




#pi .bottom h3{
	padding: 10px;
	position:relative;
	background-color: #fff;
	text-align:center;
}


#pi .bottom  .carousel{
	margin-top:0;
	margin-bottom:5em;
}


#pi .bottom  .carousel .owl-prev{
    position:absolute;
    left:-2.5em;
    z-index:9999999;
}

#pi .bottom  .carousel .owl-next{
    position:absolute;
    right:-2.5em;
}


#pi .bottom  .carousel .owl-prev,
#pi .bottom  .carousel .owl-next {
    color: #a1c327;
    font-size: 1.5em;
    margin: .5em;
    padding: .5em;
    display: inline-block;
    cursor: pointer;
    border-radius: 3px;
    font-weight:800;
    pointer-events:initial;
}

#pi .bottom  .carousel  .owl-prev:hover,
#pi .bottom  .carousel  .owl-next:hover {
    background: #a1c327;
    color: #FFF;
    text-decoration: none; 
}


#pi .bottom  .carousel .owl-controls{
}


/*assuming all things in bottom panel are related items 

#pi .prec > .bt,
#pi .pass > .bt,
#pi .prel > .bt,
#pi .pran > .bt {
    
    width: 100%;
    margin: 10px auto 0px;
    background-image: url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/line.png');
    background-repeat: repeat-x;
    background-position: center;
    text-align:center;
}
#pi .prec > .bt h3 ,
#pi .pass > .bt h3,
#pi .prel > .bt h3,
#pi .pran > .bt h3{
	display: inline-block;
	padding: 10px;
	margin: 0 auto;
	background-color: #fff;
}*/

#pi .prec .fprd,
#pi .pass .fprd,
#pi .prel .fprd,
#pi .pran .fprd{
	display:inline-block;
	vertical-align:top;
	padding:.5em;
	float:none;
	width: 274px;
	font-size:.850em;
	-webkit-transition: none;
	transition:none;
}

/*remove zoom in*/
#pi .prec .fprd:hover,
#pi .pass .fprd:hover,
#pi .prel .fprd:hover,
#pi .pran .fprd:hover{
    -webkit-transform: none;
        -ms-transform: none;
        transform: none;
}


#pi .prec .fprd .fprdimg,
#pi .pass .fprd .fprdimg,
#pi .prel .fprd .fprdimg,
#pi .pran .fprd .fprdimg{
	display:inline-block;
	vertical-align:middle;
	width:50%;
}


#pi .prec .fprd .fprdtitle,
#pi .pass .fprd .fprdtitle,
#pi .prel .fprd .fprdtitle,
#pi .pran .fprd .fprdtitle {
	display:inline-block;
	vertical-align:middle;
	width:50%;
	margin:0;
	height: initial;
	height: auto; /*max number of lines before display issues!*/
	text-align:center;
	color:#0d0d0d;
}



#pi .prec .fprd form,
#pi .pass .fprd form,
#pi .pran .fprd form,
#pi .prec .fprd form {
	width:100%;
	float:left;
}

#pi .prec .fprd:nth-child(4n),
#pi .pass .fprd:nth-child(4n),
#pi .prel .fprd:nth-child(4n),
#pi .pran .fprd:nth-child(4n){
	margin-right:0;
}





/* -------------------------------------------------------------------------------------
=Recommended products - Buy option  
------------------------------------------------------------------------------------- */


#pi .prec .sprd{}
#pi .prec .sprd form{}
#pi .prec .sprd form p{}
#pi .prec .sprd .img{}
#pi .prec .sprd .img img{}
#pi .prec .sprd a.lnk{}
#pi .prec .sprd .price,
#pi .prec .sprd .offer{}
#pi .prec .sprd .prevprice,
#pi .prec .sprd .price label,
#pi .prec .sprd .prevprice label,
#pi .prec .sprd .offer label{}
#pi .prec .sprd .price h6{}
#pi .prec .sprd h3{}




/* -------------------------------------------------------------------------------------
=buytogether
------------------------------------------------------------------------------------- */

.buytogether{
    float:left;
    width:100%;
}

.buytogether li.header{
	font-family: 'Abril Fatface', cursive;
    color:#605e5e;
    text-align:center;
    padding:.5em 0;
   	font-size:2em;
}

.buytogether  ul.boughtto{
	float:left;
	width:100%;
}

.buytogether  ul.boughtto li{
	width:90%;
	margin:.5em auto;
}

.buytogether ul.boughtto li.imgs{
    text-align:center;
    margin:0 auto;
}

.buytogether ul.boughtto li.imgs img{

	height:auto;
	margin:.5em;
	max-width:150px;
	width:22%;
	text-align:center;
	vertical-align:middle;
}

.buytogether ul.boughtto li.imgs span{
	width:5%;
	text-align:center;
	vertical-align:middle;
	font-size:2em;
}

.buytogether ul.boughtto li.prods{
	width: 70%;
	margin:0;
	margin-right:1em;
	text-align:left;
	padding-bottom:.25em;
	padding-left:.5em;
	padding-right:1em;
	float:left;
	border-right:2px #eef2f3 solid;
}

.buytogether ul.boughtto li.prods input,
.buytogether ul.boughtto li.prods span.descr,
.buytogether ul.boughtto li.prods span.price{
	float:left;
}

.buytogether ul.boughtto li.prods input{
	font-size:1em;
	width:10%;
	margin:0;
	display:inline-block;
	margin-top:.3em;
	line-height:1.5;
	
}
.buytogether ul.boughtto li.prods span.descr{
	/* font-weight:600; */
	width:70%;
}
.buytogether ul.boughtto li.prods span.price{
	float:right;
	color:#5a5859;
	font-weight:600;
	width:20%;
	text-align:right;
	float:left;
}


.buytogether ul.boughtto li.total
{
	position:relative;
	top: -2.5em;
	width: 24%;
	margin:0;
	float:left;
	text-align:center;
	font-size:1.2em;
}

.buytogether ul.boughtto li.total span{

}

.buytogether ul.boughtto li.btn{
	position:relative;
	top:-1.4em;
	width: 24%;
	margin:0;
	float:left;
	text-align:center;
	font-size:1.2em;
}


.buytogether ul.boughtto li.btn .submit{
  	float:left;
  	font-size:.8em;
  	background-color:#d94927;
  	display: inline-block;
  	text-transform:uppercase;
  	color:#fff;
  	border-radius:2em;
  	padding: .5em 1em;
  	width: auto;
  	border:1px #d94927 solid;
  	margin-bottom: .5em;
}




/* -------------------------------------------------------------------------------------
=Flags / Files
------------------------------------------------------------------------------------- */


#pi .flags{
	display:inline-block;
}

#pi .flags .flag{
	display:inline-block;
	margin-bottom:.5em;
}

/* Links, File & Flags panes   
------------------------------------------------------- */
#pi .pilinks, 
#pi .pifile{
	display:inline-block;
	width:100%;
}

#pi .piflags{
	display:inline-block;
}

#pi .piflags ul{
}

#pi .piflags li{
	display:inline-block;
	margin-bottom:.5em;
}

#pi .pilinks .bt, 
#pi .pilinks .bb, 
#pi .pifile .bt, 
#pi .pifile .bb, 
#pi .piflags .bt, 
#pi .piflags .bb{
    display: none;
}

#pi .pilinks .bc, 
#pi .pifile .bc, 
#pi .piflags .bc{
    float: left;
    border: none;
    width:100%;
}

#pi .pilinks ul li,
#pi .pifile ul li{
	font-size:0.938em;
	display:inline-block;
	margin-bottom:.5em;
	width:100%;
}
#pi .pilinks ul li a, 
#pi .pifile ul li a{}
#pi .pilinks ul li .linkimg, 
#pi .pifile ul li .linkimg{
	display:inline-block;
	vertical-align:middle;
	margin-right:1em;
}

#pi .pilinks ul li .linkimg img, 
#pi .pifile ul li .linkimg img{
	display:inline-block;
	vertical-align:middle;
	/* margin-right:1em; */
	width:1em;
	height:auto;
}

#pi .pilinks ul li a.lnk,
#pi .pifile ul li a.lnk{}
#pi .pilinks ul li.email a.lnk{
	color:#a1c327 ;
	padding-left:1.9em;
	display:inline-block;
	vertical-align:middle;
}

#pi .pilinks ul li.query a.lnk{
	/* background:url('https://s3-eu-west-1.amazonaws.com/doorsfittings/4816896/i/bdr/greyenvelope.png') no-repeat left center; */
	/* padding-left:1.9em; */
	cursor:pointer;
	display:inline-block;
	vertical-align:middle;
}


/* -------------------------------------------------------------------------------------
=Videos 
------------------------------------------------------------------------------------- */

#pi .youtube a{}

/* -------------------------------------------------------------------------------------
=Wishlist 
------------------------------------------------------------------------------------- */

#pi .pibuy form.wishlist{}
#pi .pibuy form.wishlist input.chkbox{}
#pi .pibuy form.wishlist label{}
#pi .pibuy form.wishlist .submit{}

/* -------------------------------------------------------------------------------------
=Social bookmarks pane    
------------------------------------------------------------------------------------- */
#pi .socbook{
	float:left;
	width:100%;
	text-align:center;
	margin-bottom:.5em;

}
#pi .socbook li{}

/* -------------------------------------------------------------------------------------
=Feefo 
------------------------------------------------------------------------------------- */

#pi #feefologohere{}

#pm #pi .pi_tab_content ul.feefo li{
    list-style: none;
    border-bottom: 1px solid #D2D2D2;
}

#pm #pi .pi_tab_content ul.feefo li:last-child{
    border-bottom: none;
}
:root{
		--font-awesome:	"Font Awesome 6 Pro";
		--heading-font: 'Playfair Display';
	--white:#fff;
	--text-font:'Lato';
	--spacing:1em;
}

#pm .form form ul li.signin{
	margin-bottom:.5em;
}

#pm .form form ul li.req{
	margin:.5em 0;
	color:#d17f85 ;
}

.deladd{
	margin:1em !important;;
}
label[for^="source"]{
	display:none !important;;
}

.terms h5{
	margin-top:1em;
	font-size:16px !important;
	display:inline-block;
	margin-right:1em;
}

.terms h5 input {
	display:inline-block;
	margin:.5em !important;

}

.chkflow #ptf{
	display:none;
}

/* -------------------------------------------------------------------------------------
=Basket - Checkout v5
------------------------------------------------------------------------------------- */
/*needs #pm as .bskt is used in the header */
#pm .bskt {
	display: grid;
	grid-template-columns: 6fr 3fr;
	grid-gap: 0;
	grid-column-gap: 2em;
	grid-template-areas: "breadcrumb breadcrumb"
		"header header"
		"lines totals"
		"lines shipping"
		"lines buttons"
		"lines voucher"
		
		"lines ."
		"art art"
		"prioritydelivery prompane"
		"standarddelivery prompane"
		". prompane";
	align-items: start;
	margin-bottom: 4rem;
}

#pm .bskt form {
	margin: 0 auto;
	padding: 0;
}

/* if basket is empty and user is in it */
.bskt .empty {}
.bskt .empty .header {}
.bskt .empty .total {}

/* Checkout Breadcrumb
------------------------------------------------------- */
.chkcrumb {
	grid-area: breadcrumb;
}

/* Basket header
------------------------------------------------------- */
#pm .bskt .header {
	margin:1em;
	text-align:center;
	grid-area: header;
}

#pm .bskt .header .icon{
	display:none;
}

#pm .bskt .header .title {
	display: block;
	font-family: var(--heading-font);
	font-weight: var(--heading-font-weight);
	font-size: 1.5rem;
	margin-bottom: 1rem;
}

#pm .bskt .header .title span {
	font-size: 1rem;
	font-weight: normal;
	color: var(--grey);
}

/* Basket Lines
------------------------------------------------------- */
#pm .bskt .alllines {
	grid-area: lines;
	max-height: 650px;
	/* padding: 1rem; */
	overflow-y: auto;
	border:1px solid #2c1a30;
	/* border-top: 8px #d17f85 solid; */
	background-color:#fff;
}

#pm .bskt .line {
	padding-bottom: 1em;
	/* margin-bottom: 1em; */
	align-items: start;
	display: grid;
	--image-width: 4rem;
	--description-width: 1fr;
	--qty-width: auto;
	--netprice-width: auto;
	--rem-width: auto;
	--total-width: 100px;
	grid-template-columns: var(--image-width) var(--description-width) var(--qty-width)  var(--total-width) var(--rem-width);
	grid-template-areas:
		"icon desc qty price rem"
		"icon desc . . . "
		"icon netprice . . ."
		"icon skuselect . . . ";
	border-bottom:1px solid #d5d6d6;
	grid-column-gap: 1rem;
}

/* Image */
#pm .bskt .line .prodimg {
	grid-area: icon;
}

#pm .bskt .line .prodimg img {
	margin: 0;
	max-width:100%;
	height:auto;
}

/* Product Info - in list form */
#pm .bskt .line .prodinfo {
	grid-area: desc;
	margin: 0;
	padding: 0;
}

#pm .bskt .line .prodinfo .surcharge {
	font-weight: 700;
}

#pm .bskt .line .prodinfo li {
	list-style: none;
	font-size: 12px;
	margin-left:.5em
}

#pm .bskt .line .prodinfo li img {
	margin: 0;
	max-width: 250px
}

#pm .bskt .line .prodinfo li.descr,
#pm .bskt .line .prodinfo li.sample{
	margin-left: 0;
	font-size: 20px;
	font-family: var(--heading-font);
	font-weight: var(--heading-font-weight);
	/* margin-bottom: var(--half-spacing); */
}

#pm .bskt .line .prodinfo li.lead {
	color: var(--info-color);
	font-weight: bolder;
}

#pm .bskt .line .prodinfo li.lead {
	color: var(--text-color);
	font-style: italic;
	font-weight: normal;
	margin: .5rem 0;
}

#pm .bskt .line .prodinfo li.lead span {
	display: inline-block;
	color: var(--navy);
	font-style: normal;
	border: 1px var(--navy) solid;
	padding: .25rem;
	border-radius: .25rem;
	margin-right: .5rem;
}

#pm .bskt .line .prodinfo li.lead span:before {
	font-family: var(--font-awesome);
	content: "\f00c";
	display: inline-block;
	font-size: 1em;
	margin-right: 1em;
}

/*product quantity */
#pm .bskt .lines .line .qty {
	grid-area: qty;
	align-self: center;
}
#pm .bskt .lines .line .netprice {
	grid-area: netprice;
	font-size:.725em;
	margin-left:.5em
}



#pm .bskt .lines .line .qty form {
	line-height: 1;
}

#pm .bskt .lines .line .qty label,
#pm .bskt .lines .line .qty #update{
	display:none;
}

#pm .bskt .lines .line .qty button {
	background: var(--white);
	border: 1px solid black;
	font-size:16px;
	padding: .5em;
	font-family: monospace;
}

#pm .bskt .lines .line .qty button.skuqtybsktsub {
	border-right: 0;
}

#pm .bskt .lines .line .qty button.skuqtybsktadd {
	border-left: 0;

}

#pm .bskt .lines .line .qty input.inputtext {
	text-align: center;
	border-radius: 0;
	border-left: 0;
	border-right: 0;
	font-family: monospace;
		font-size:16px;
	margin:0;
	height:19px;
}

/* remove item */
#pm .bskt .line .rem {
	grid-area: rem;
	text-align: center;
	align-self: center;
}

#pm .bskt .line .rem input {
	font-family: var(--font-awesome);
	color: #d5d6d6;
	background-color: transparent;
	border: none;
	font-weight: 400;
}

/* if product is multi sku then show this in the same area as the quantity update */
#pm .bskt .lines .line .skuselect {
	grid-area: skuselect;
	align-self: end;
}

#pm .bskt .lines .line .skuselect select {
	margin: 0;
	font-size: small;
	width: auto;
}

/* remove item */
#pm .bskt .line .price {
	grid-area: price;
	text-align: center;
	font-family: var(--headtexting-font);
	font-weight: 600;
	align-self: center;
}

/* out of stock messages */
.oos {
	color: var(--error-color);
}

/* Basket Sample Lines
------------------------------------------------------- */
#pm .bskt .lines.sample {
	grid-area: samples;
}

/* Basket Subtotal
------------------------------------------------------- */
.prodsubtotal {
	/*why display this... we have this info in the totals area... */
	display: none;
	grid-area: basket-sub-total;
	text-align: right;
	font-size: 1.25em;
	margin-bottom: var(--spacing);
}

.prodsubtotal label {}

.prodsubtotal span {}

/* Delivery info
------------------------------------------------------- */
/* for free delivery messages */
#pm .bskt .header.freedel {
	grid-area: freedelivery;
	font-weight: 400;
	text-transform: none;
	font-size: 1em;
	padding: 0;
	display:none;
}

.header.delivery {
	/*doesn't exist but should be on the actual delivery header */
}

/* Shipping 
------------------------------------------------------- */
.shipping {
	grid-area: shipping;
	text-align:center;
}

.shipping .header{
	display:none;
}

.shipping  select{
	width: 299px;
	margin-bottom:1em;
}

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

.shipping ul li.ship {
	margin: 0;
	padding: 0;
	list-style: none;
	margin-bottom: var(--half-spacing);
	display: grid;
	grid-template-columns: 4em 1fr;
}

.shipping ul li.ship input {
	margin: 0;
	padding: 0;
	margin-right: auto;
	font-size: 2em;
	-ms-transform: scale(1.5);
	/* IE 9 */
	-webkit-transform: scale(1.5);
	/* Chrome, Safari, Opera */
	transform: scale(1.5);
}

.shipping ul li.ship label {
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 100px;
	font-weight: normal;
}

.shipping ul li.ship input[type="radio"]:checked+label {
	font-weight: 700;
}

.shipping ul li.ship label span {
	margin-left: var(--half-spacing);
	text-align: right;
}

.shipping form input, .shipping form h4 {
	margin: 0;
	padding: 0;
	display: inline-block;
	vertical-align: middle;
	margin-right: var(--half-spacing);
}

.shipping form h4 {}

.shipping ul li.delivery {}

.shipping ul li.delivery .address h4{
	display:none;
}

.shipping ul li.delivery.deliveryto {
	display: block;
}

/*if only one country we show the country as a span - a bit redundant so hidden */
.shipping .delivery.deliveryto form span {}

.shipping ul li.delivery.collectstore {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-areas: "title title" "location location" "address options";
}

.shipping ul li.delivery.collectstore label {
	grid-area: title;
}

.shipping ul li.delivery.collectstore form {
	grid-area: location
}

.shipping ul li.delivery.collectstore.info:before {
	display: none;
}

.shipping ul li.delivery.collectstore p {
	padding: 0;
	margin: 0;
}

.shipping ul li.delivery.collectstore .address {
	margin-left: var(--spacing);
	font-size: small;
}

/*better code structure needed - is just a p if only one option is available*/
.shipping ul li.delivery.collectstore #serviceid, .shipping ul li.delivery.collectstore .address+p {
	grid-area: options;
}

/* Basket Totals
------------------------------------------------------- */
.bskttotals {
	grid-area: totals;
	text-align: center;
	padding: var(--spacing);
	display: grid;
	grid-template-areas: "subtotals" "discount" "discount2" "totals" ;
	background-color:var(--off-white);
	border:none;
}

.bskttotals .total {
	grid-row: total;
	text-align:center;
}

.bskttotals .total span {
	grid-area: totals;
	font-size: 2rem;
	font-weight: var(--heading-font-weight);
}

.bskttotals .total label {
	display: block;
	margin-bottom: var(--spacing)
}

.bskttotals .total span {
	display: block;
	width:100% !important;;
	margin-bottom: var(--half-spacing);
}

.bskttotals .subtotal {
	grid-area:subtotals;
	margin: 0 2rem;
	display: grid;
	grid-template-areas:
		"label total"
}

.bskttotals .subtotal+.subtotal {
	grid-area:discount;
	display: grid;
}
.bskttotals .subtotal+.subtotal+.subtotal {
	grid-area:discount2;
	display: grid;
}

.bskttotals .subtotal label {
	display: block;
	grid-area: label;
	text-align: left;
}

.bskttotals .subtotal span {
	display: block;
	grid-area: total;
	text-align: right;
	width:unset;
}

/* Vouchers
------------------------------------------------------- */
.vouchentryaccord, .vouchentry {
	grid-area: voucher;
	background-color: var(--off-white);
	padding: 0 1rem;
	text-align: center;
}

.vouchentryaccord ul, .vouchentry ul {
	list-style: none;
}

.vouchentryaccord li, .vouchentry li {
	list-style: none;
}

.vouchentryaccord li.pane {
	display: none;
}

#pm .bskt .vouchentryaccord .header {
	font-size: 1rem;
	border: none;
	border: 0;
	padding: 0;
	font-size: .825rem;
	text-decoration: underline;
	align-items:center;
	border:1px solid var(--navy);
	padding:1em;
}

#pm .bskt  .accordion .header.current {
	margin-bottom: 0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom:0;
}

.vouchentryaccord .header img {
	width:1.5em;
}

#pm .ul.accordion .vouchentryaccord .pane, #pm .bskt ul.accordion .pane {
	padding: 1em;
	padding-top:0;
	display: none;
	border:1px solid var(--navy);
	border-top:0;
}

#pm .bskt ul.accordion li.pane ul {
	margin: 0;
}

.vouchentry ul.vouch {
	margin: 0;
	padding: 0;
	display: grid;
	grid-row-gap: .5em;
	grid-template-columns: 1fr 100px;
	grid-template-areas: "code submit"
}

.vouchentry .appliedpromovoucher {
	/* margin-top:1em; */
	padding: var(--half-spacing) var(--half-spacing);
	font-size: .725rem;;
}

.vouchentry .remove a {
	display: block;
	background-color: var(--navy);
	border-color: var(--navy);
	font-size: .725rem;
}

.remove input {
	width: 100%;
	display: block;
}

.vouchentry ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.vouchentry ul li.info {
	grid-area: title;
	/*due to duplicate title when voucher applied */
	display: none;
}

.vouchentry ul li.vouchentry {
	grid-area: code;
}

.vouchentry ul li.vouchentry input {
	width: 100%;
	font-size:.725em;
}

.vouchentry .submit {
	grid-area: submit;
	background-color: var(--navy);
	border-color: var(--navy);
	margin-left: .5rem;
	font-size:.725em;
}

/* Basket Payment Buttons
------------------------------------------------------- */
.bsktbuttons {
	grid-area: buttons;
	text-align: center;
	padding: var(--spacing);
	background-color:var(--off-white);
	margin-bottom: 1rem;
	display:grid;
	grid-template-areas:"pay"
	"continue"
	"logos"
}

.bsktbuttons .startcheckout {
	grid-area: pay;
	margin-bottom: .5em;
}

.bsktbuttons .startcheckout a:before {
	content: "\f023";
	font-family: var(--font-awesome);
	margin-right: 1rem;
}

.bsktbuttons .startcheckoutcollect {
	grid-area: collect;
	margin-bottom: .5em;
}

.bsktbuttons .startcheckout a.btn {
	display: block;
	float:none;
	margin:0;
}

.bsktbuttons .clear {
	grid-area: empty;
}

.bsktbuttons .clear a.btn {
	display: block;
	margin-top: 1em;
}

.bsktbuttons .cont {
	grid-area: continue;
	/* display: none; */
}

.bsktbuttons .cont a.btn {
	display: block;
	font-size: .825rem;
	border: 2px var(--button-color) solid;
	background-color: transparent;
	color: var(--button-color);
}

#pm .bsktbuttons .art {
	grid-area: logos;
	margin-top:1em;
}
#pm .bsktbuttons .art ul{
	margin:0;
}
#pm .bsktbuttons .art li {
	display: inline-block;
	font-size:20px;
	margin: .5rem;
}
#pm .bsktbuttons .art li a{
	color:black;
}

.bsktbuttons .art h4 {
	font-family: var(--headingFont);
	font-size: 1em;
	font-weight: 700;
	text-transform: capitalize;
}

#pm .bskt .art#a128581638{
	grid-area:art;
}

/*promo content on basket - awful layout - why is this a ul?*/

#pm ul.prompane {
	grid-area: prompane;
	list-style: none;
	grid-gap: 0;
	grid-column-gap: 4em;
	margin: 0;
}

#pm ul.prompane li i {
	grid-area: icon;
	color: var(--navy)
}

#pm ul.prompane li span {
	grid-area: text;
	font-size: .825rem
}

/* delivery messages*/
.stddelinfo {
	grid-area: standarddelivery;
}

.priordelinfo {
	grid-area: prioritydelivery;
}

.priordelinfo, .stddelinfo {
	display: grid;
	border-radius: var(--border-radius);
	background-color: var(--off-white);
	padding: var(--spacing);
	margin-bottom: 1rem;
	grid-template-areas: "icon message price" "icon details .";
	grid-template-columns: 4rem 1fr 5rem;
	grid-column-gap: 2rem;
}

.priordelinfo img, .stddelinfo img {
	grid-area: icon;
}

.priordelinfo h4, .stddelinfo h4 {
	grid-area: message;
	margin: 0;
}

.priordelinfo h5, .stddelinfo h5 {
	grid-area: details;
	margin: 0;
	font-family: var(--text-font);
	font-weight: 400;
	font-size: .825rem
}

.priordelinfo p, .stddelinfo p {
	grid-area: price;
	margin: 0;
	font-weight: 700;
}

.ordertimer {
	font-size: .825rem;
}

#pm ul.prompane .returns {
	display: grid;
	grid-template-areas: "icon message ." "icon details . ";
	grid-template-columns: 4rem 1fr auto;
	grid-column-gap: 2rem;
	align-items: center;
}

#pm ul.prompane .returns img {
	grid-area: icon;
}

#pm ul.prompane .returns h4 {
	grid-area: message;
	margin: 0;
}

#pm ul.prompane .returns h5 {
	grid-area: details;
	margin: 0;
	font-family: var(--text-font);
	font-weight: 400;
	font-size: .825rem
}

/* -------------------------------------------------------------------------------------
=New Checkout Process - replaces Checkout v5 Accordion Option
------------------------------------------------------------------------------------- */

#pt.checkouttop {
	background:#fff;
	margin-bottom:2em;
}

#pt.checkouttop .ext {
	--site-max-width:1200px;
	display:grid;
	align-items:center;
	--breadcrumb-width: 1fr;
		--spacerwidth: calc((100% - var(--site-max-width)) / 2);
	grid-template-columns: var(--spacerwidth) 1fr var(--breadcrumb-width) var(--spacerwidth);
	grid-template-areas: ". logo breadcrumb .";

	
}

/* site logo */
#pt.checkouttop .ext .pbnr{
	grid-area:logo;
	margin:1em auto ;
}

#ptf .ext {
	padding:.25rem;
	display: grid;
	grid-template-areas:
		". message .";

}

#pt.checkouttop .ext .pane {
	grid-area: breadcrumb;
	text-align: center;
}

#pt.checkouttop .ext .pane li {
	display: inline-block;
	margin: 0;
	margin-right: 1em;
}

#pt.checkouttop .ext .pane li:last-child {
	margin-right: 0em;
}

#pt.checkouttop .ext .pane li:before {
	font-family: var(--font-awesome);
	content: "\f054";
	display: inline-block;
	font-size: 1em;
	margin-right: 1em;
}

#pt.checkouttop .ext .pane li:first-child:before {
	content: "";
	margin: 0;
	display: none;
}

.chksteps_prev, .chksteps_curr, .chksteps_next {
	text-transform: capitalize;
	font-family: var(--heading-font);
	font-weight: var(--heading-font-weight)
}

.chksteps_prev {
	color: var(--grey)
}

.chksteps_curr {
	color: var(--text-color)
}

.chksteps_next {
	color: var(--light-grey)
}

/* Signin/guest pane
------------------------------------------------------- */
.page_checkoutsignin {}

.checkoutsignin .signin {
	width: 50%;
	margin: auto;
	display: grid;
	align-items: start;
	grid-template-columns: 1fr;
	grid-gap: 4em;
	grid-template-areas: "signin" "guest ";
}

.page_checkoutsignin .form#psign {
	grid-area: signin;
	width: auto;
}

.page_checkoutsignin .form#pguest {
	grid-area: guest;
	width: auto;
}

.page_checkoutsignin .form label {
	display: block;
}

.page_checkoutsignin form input,
.page_checkoutsignin form select {
	width: calc(100% - 2em);
}

.page_checkoutsignin form img{
	display:inline-block;
	vertical-align:top;
}




.page_checkoutsignin .form#psign .submit,
.page_checkoutsignin .form#pguest .submit {
	grid-column:1/-1;
	width:auto;
	padding: var(--half-spacing) var(--spacing);
	margin: auto;
}

.exstregfield {
	display: none;
}

.page_delivery, .page_checkout, .page_checkoutsignin, .page_delivery, .page_shipping, .page_payment {}

/* Address (delivery and invoice) 
------------------------------------------------------- */




.page_delivery h3, .page_checkout h3 {
	font-size: 1.5em;
	font-weight: var(--heading-font-weight);
	position: relative;
	z-index: 1;
	overflow: hidden;
	text-align: center;
	margin-bottom: 2rem;
}
.page_delivery form, .page_checkout form {
	display: grid !important;
	margin:auto!important;
	grid-template-columns: 6fr 3fr;
	grid-template-areas:
		"address summary"
		"address continue"
		"address .";
	grid-column-gap: 1rem;
}

#pm .page_delivery form input, .page_checkout form input, .page_delivery form select, .page_checkout form select {
	width: calc(100% - 2em);
	margin-right:0;
}

.page_delivery form img, .page_checkout form img{
	display:inline-block;
	vertical-align:top;
	margin-left:.25em;
}

.page_delivery form .terms, .page_checkout form .terms {}

.page_delivery form .terms h5, .page_checkout form .terms h5 {
	/* display: grid; */
	/* grid-template-areas:
		"checkbox text"; */
	/* grid-template-columns: 2rem 1fr; */
	/* align-items: center; */
	font-family: var(--text-font);
	font-weight: normal;
	font-size: .825rem;
	text-transform:none;
	letter-spacing:unset;
}

.page_delivery form .terms input, .page_checkout form .terms input {
	grid-area: checkbox;
	margin: 0;
	width:auto;
}

.page_delivery form .termsart, .page_checkout form .termsart {
	text-align: left;
	font-size: .825rem;
}

/*class needed on this ul!*/
.page_delivery #pm form>ul, .page_checkout #pm form>ul {
	grid-area: address;
	border:1px solid #2c1a30;
	/* border-top: 8px #d17f85 solid; */
	background-color:#fff;
	padding:1em;
	text-align:center;
}

.page_delivery #pm form>ul input, .page_checkout #pm form>ul input,
.page_delivery #pm form>ul select, .page_checkout #pm form>ul select{
	margin:.5em 0;
	width:320px;
	font-size:16px;
}

.page_delivery #pm form>ul input[type="checkbox"], .page_checkout #pm form>ul input[type="checkbox"]{
	width:auto;
	vertical-align:middle;
}

.page_delivery #pm form>ul input[type="checkbox"] + label, .page_checkout #pm form>ul input[type="checkbox"] + label{
	display:inline;
	vertical-align:middle;
	margin-left:.5em;
}

.page_delivery #pm form>ul li, .page_checkout #pm form>ul li{
	margin-bottom:.5em;
	width:400px;
	margin:auto;
	text-align:left;
	display:inline-block;
}

.page_checkout .subscribe{
	padding:1em;
}

.page_delivery .form li.info, .page_checkout .form li.info {
	display: none;
}

.page_delivery .form li label, .page_checkout .form li label {
	display: none;
}

.page_delivery .form li.reqmsg, .page_checkout .form li.reqmsg {
	color: var(--error-color);
	color:red;
	font-weight:bold;
	padding-top:1em;
	/* display:inline; */
}

.page_delivery .form li.req, .page_checkout .form li.req{
	font-size:small;
	margin:.5em 0;
}

#countryIdDel,
#countryId,
#source_7012352,
.page_delivery textarea, .page_checkout textarea{
	width:320px;
}

.page_delivery .chars, .page_checkout .chars{
	font-size:small;
	text-align:right;
}

.page_delivery .help, .page_checkout .help{
	font-size:small;
	dis
}

.page_delivery .submit, .page_checkout .submit {
	grid-area: continue;
margin-right:1em;
}

/*display corrections for same invoice as delivery address checkbox */
.page_delivery .form .deladd .chkbox {
	width: auto;
	margin-right: 1rem;
}

.page_delivery .form .deladd label {
	display: inline-block;
}

/*if member this shows */
.page_delivery li.chkbox {}

.page_delivery li.chkbox input {
	width: auto;
	margin: 0;
	margin-right: .5rem;
	display: inline-block;
	vertical-align: middle;
}

.page_delivery .chkbox .help {
	display: inline-block;
	vertical-align: middle;
}

.page_delivery form[name="delAddress"] {}

.page_delivery .remove {
	font-size: .825rem;
	color: var(--error-color)
}

/* Postcode Lookup
------------------------------------------------------- */
.page_delivery .form li .pclup, .page_checkout .form li .pclup {}
.page_delivery .form li .pclup label, .page_checkout .form li .pclup label, .page_delivery .form li .pclupdel label, .page_checkout .form li .pclupdel label {}
.page_delivery .form li label[for="txtPostCodeLookup"], .page_checkout .form li label[for="txtPostCodeLookup"], .page_delivery .form li label[for="ddlMultiAddress"], .page_checkout .form li label[for="ddlMultiAddress"] {
	display: none;
}

.page_delivery .form li .pclup input, .page_checkout .form li .pclup input, .page_delivery .form li .pclupdel input, .page_checkout .form li .pclupdel input {
	width: auto;
	display: inline-block;
}

.page_delivery .form li .pclup input.submit, .page_checkout .form li .pclup input.submit, .page_delivery .form li .pclupdel input.submit, .page_checkout .form li .pclupdel input.submit {}
.page_delivery .form li .pclup span.or, .page_checkout .form li .pclup span.or, .page_delivery .form li .pclupdel span.or, .page_checkout .form li .pclupdel span.or {
	display: none;
}

.page_delivery .form li .pclupdel, .page_checkout .form li .pclupdel {}
.page_delivery form[name="back"] {
	display: none !important;
}

/* Order Fulfilment/shipping
------------------------------------------------------- */
.page_shipping {}
.shipdel{
	width:400px;
	margin:auto;
}

.page_shipping .pmfull {
	margin: 0 auto;
	position: relative;
	width: calc(var(--site-max-width) / 2);
}

.page_shipping h3 {
	font-size: 1.5em;
	font-weight: var(--heading-font-weight);
	position: relative;
	z-index: 1;
	overflow: hidden;
	text-align: center;
	margin-bottom: 2rem;
}

.page_shipping select {
	width: 100%;
}

.page_shipping .service, .page_shipping .shippinginfo {
	margin: 1rem 0;

}
.page_shipping .deliveryinfo
{
		display:none;
}

.page_shipping .subtotal {
	margin: 1rem 0;
	display: grid;
	grid-template-areas: "label value";
	grid-template-columns: 1fr auto
}

.page_shipping .subtotal label {
	grid-area: label;
	font-family: var(--heading-font);
	font-weight: var(--heading-font-weight)
}

.page_shipping .subtotal span {
	grid-area: value;
	text-align: right;
}

.page_shipping .cont a {
	display: block;
}

/* Payment
------------------------------------------------------- */
.page_payment {}

.page_payment #pm .bc{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-areas: "header header"
						 "payment summary"
						 ". summary"
						 "details summary";
	grid-column-gap: 4rem;
	position: relative;
}

.page_payment #pm .bdcb{
	display:none;
}

.page_payment #pm .bt {
	grid-area: header;
	text-align: center;
	margin-bottom: 1rem
}

.payoptsform{
	grid-area:payment;
}



.page_payment h3 {
	font-size: 1.5em;
	font-weight: var(--heading-font-weight);
	position: relative;
	z-index: 1;
	overflow: hidden;
	text-align: center;
	margin-bottom: 2rem;
}

.termsagreemsg {
	margin-bottom: 1em;
	text-align: center;
}

.termsart {
	margin-bottom: 1em;
	text-align: center;
}

/*payment article */
.page_payment #pm .art {
	grid-area: header;
}

.page_payment #pm .art ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.page_payment #pm .art li {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas: "icon text";
	grid-gap: var(--spacing);
	padding: 1rem;
	border: 1px solid var(--border-color);
	border-radius: var(--border-radius);
	margin-bottom: 1rem;
}

.page_payment #pm .art li:last-child {
	margin-bottom: 0;
}

.page_payment #pm .art li i {
	grid-area: icon;
	color: var(--navy)
}

.page_payment #pm .art li span {
	grid-area: text;
	font-size: .825rem
}

.payoptentry, #psagepay {
	grid-area: details;
}

.page_payment #pm form.payoptsform .submitcontainer {
	/* grid-area: pay; */
	/* text-align: center; */
	/* position: absolute; */
	/* bottom: 0; */
	/* right: 0; */
	/* width: calc(50% - 2rem); */
}

.page_payment input[type="submit"] {
	/* color:var(--text-color); */
	display: block;
	padding: 1rem 0;
	width: 100%;
}

.confirmorder {
	grid-area: details;
}



/* Payment
------------------------------------------------------- */
.page_payment{}

.termsagreemsg{
	margin-bottom:1em;
	text-align:center;
}

.termsart{
	margin-bottom:1em;
	text-align:center;
}

.payopts{
	display:grid;
	grid-template-columns:1fr;
	grid-gap:1em;
	/* grid-template-rows:50px; */
	grid-template-areas:
		"dna"
		"google"
		"apple"
		"paypal"
		"invoice";
}

.payopts > div {
	display:inline-block;
	/* margin-left:1em; */
}

.payopts .paypal submit:hover,
.payopts .paypal .btn:hover {
	 border:0;
}

.payopts .paypal{
	background:none;
	padding:0;
	border:0;
	border-radius:0;
	max-height:42px;
	overflow:hidden;
	align-content:center;
	align-items:center;
	display:grid;
}

.payopts .paypal.btn:hover{
	border:0;
}

/* dna payments */
.pt_debitcreditcard {
	grid-area:dna;
}

.pt_debitcreditcard a{
	display:block;
	border-radius:0;
	color:var(--white);
	background-color:black;
	font-weight:600;
	height: 46px;
	padding:0;
	align-content:center;
	border:0;
	border-radius:4px;
}

.pt_debitcreditcard a:hover{
	border:none;
}

.pt_debitcreditcard a:before{
	content:'\f09d';
	font-family:var(--font-awesome);
	margin-right:.5em;
}


/* invoice */
.pt_invoice  {
	grid-area:invoice;
}

.pt_invoice  a{
	display:block;
	border-radius:0;
	color:var(--white);
	font-weight:600;
	height: 46px;
	padding:0;
	align-content:center;
	border:0;
	border-radius:4px;
}

.pt_invoice  a:hover{
	border:none;
}

.pt_invoice  a:before{
	content:'\f570';
	font-family:var(--font-awesome);
	margin-right:.5em;
}

/* google pay */
.pt_googlepay {
	grid-area:google;
}
#googlepaybtncontainer {
	height: 46px;
	border-radius:4px;
}


/* apple pay */
.pt_applepay  {
	 grid-area:apple;
}
#applepaybtncontainer {
	height: 46px;
}

/* paypal */
.pp_button {
	grid-area:paypal;
	height: 46px;
	background-color:#f0c74b;
	align-content:center;
	border-radius:4px;
}

.pp_button img {
	grid-area:paypal;
}


.dnapayments.payoptentry {
	background-color:var(--white);
	padding:1em;
	margin-bottom: 1em;
}

.dnapayments.payoptentry label{
	display:none;
}

@media only screen and (max-width: 600px) {
.dnapayments.payoptentry {

	grid-row: 2;
}
}

#submitpaymentpanel{display:block;border-radius:0;color:#fff;font-weight:600;height: 46px;padding:0;align-content:center;border:0;border-radius:4px;background-color:black;}

.hostedfield {
	height:35px;
	border-color:var(--border-color);
	border-radius: .25rem;
	font-size: 16px;
	padding: .5em;
	width: auto;
	border-width:1px;
	border-style:solid;
	margin-bottom:.5em;
}

.dna-payments-hosted-field-focused {
  border-color: #80bdff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.dna-payments-hosted-field-valid {
  border-color: #28a745;
}
.dna-payments-hosted-field-valid.dna-payments-hosted-field-focused {
  box-shadow: 0 0 0 0.2rem rgb(40, 167, 69, 0.25);
}
.dna-payments-hosted-field-invalid {
  border-color: #dc3545;
}
.dna-payments-hosted-field-invalid.dna-payments-hosted-field-focused {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

#threedsecurecontainer{
	min-width: 515px;
}



/* Basket Summary
------------------------------------------------------- */
.bsktsum {
	grid-area: summary;
	align-self: start;
}

.bsktsum h4 {
	display: none;
}

.bsktsum .lines {
	overflow-y: scroll;
	max-height: 200px;
	background-color:#fff;
	padding: 1rem;
	padding-left: .5rem;
	display:none;
}

.bsktsum .lines .line {
	align-items: start;
	display: grid;
	grid-template-columns: 1fr auto 10ch;
	grid-template-areas:
		"desc qty price";
	grid-column-gap: 1rem;
}

@media only screen and (max-width: 600px) {
	.bsktsum .lines .line {
		align-items: start;
		display: grid;
		grid-template-columns: 64px 1fr;
		grid-template-areas:
			"img desc "
			"qty price";
		grid-column-gap: 1rem;
	}
}

.bsktsum .lines .line .unitprice {
	display: none;
}

/* Product Info - in list form */
.bsktsum .lines .prodinfo {
	grid-area: desc;
	list-style: none;
}

#pm .bsktsum .lines li {
	font-size: .725rem;
	margin-left: .5rem;
	display:none;
}

#pm .bsktsum .lines li.descr {
	font-size: .825rem;
	font-family: var(--heading-font);
	font-weight:500;
	margin-left: 0;
	display:inline-block;
}

#pm .bsktsum .lines li.lead{
		display:inline-block;
}

.bsktsum .lines li.flags {}

.bsktsum .lines li.flags img {
	margin: 0;
	max-width: 100%;
}

.bsktsum .lines .qty {
	grid-area: qty;
	font-size:.825em;
}

.bsktsum .lines .qty:before{
	content:"x"
}

.bsktsum .lines .qty label {
	display: none;
}

.bsktsum .lines .price {
	grid-area: price;
	font-size:.825em;
	text-align: right;
}

.bsktsum .totals {
	margin-top: 1rem;
	text-align: right;
	font-weight:700;
	font-size:.825em;
}

.bsktsum .totals label{ 
	font-weight:400;
	text-align:left;
}

.bsktsum .totals .subtotal {
	display: grid;
	grid-template-areas:"label value";
	margin:0 2rem;
	/* grid-template-columns:1fr 100px; */
	/* grid-gap:.5em; */
}

.bsktsum .subtotal span{
	font-weight:600;
	/*fix a min width for different number alignment */
	display:inline-block;
	width:unset;
}

.bsktsum .totals .subtotal:last-child {
	color:var(--blue);
	display:block;
	text-align:center;
	font-size:2em;
	padding:1em;
}

.bsktsum .totals .subtotal:last-child label {
	font-weight: 400;
	display:inline-block;
	margin-right:.5em;
	color:var(--grey)
}

.bsktsum .totals .subtotal:last-child span {
	font-weight: 700;
}

.ordertotal{}

/* Continue Checkout Process
------------------------------------------------------- */
.page_delivery .contbtn, .page_checkout .contbtn {}
.forinvoice {}
.page_delivery .forinvoice .chkbox label {}
.page_delivery .contbtn input, .page_checkout .contbtn input {
	width:100%;
}