/* ------------------------------------------------------------------------------------
        SCREEN - Kates Skates 2018
        Filename : mobile.css
        Last Updated : 14. 02. 2018
        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. =AccordionBase
	08. =PanelTop
	09. =Breadcrumb
	10. =CenterPanel
	11. =MainPanel
	12. =RightPanel
	13. =LeftPanel
	14. =FooterPanel
	15. =BottomPanel
	16. =FilterSearch
	17. =SearchHeader / SearchFooter 
	18. =DepartmentTree
	19. =FeaturedProducts
	20. =RecentItems
	21. =ProductLists
	22. =ProductPage 
	23. =HoverBasket
	24. =Basket
	25.	=Checkout process
	26.	=Sitemap
	27. =Messages
	28. =AutoComplete
	29. =Articles
	30. =CustomArticles
	31. =MyAccount
	32. =Blog

	33. =OwlCarousel/Jquery Base
	34. =Jquery Base Overrides
	35.	=Hacks

		Colors Used;
			color:#92c94e;
			color:#ec519d;
			color:#ffe14f;
			color:#0397d6;
			color:#61666b;
			color:#dcdcdc;
			color:#807F83;
	
------------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------------
=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{
    font-family: 'Open Sans', sans-serif;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
}

iframe{
	width:100% !important;
}

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

html{
	-webkit-font-smoothing: antialiased
}

body{
    background-color: #ffffff;
}

#site{
    width: 100%;
    margin: auto;
    color: #61666b;
    background-color: #FFFFFF;
    font-size: 16px;
    font-weight: normal;
    text-align: left;
    -webkit-text-size-adjust: 100%;
}

li{
	/*because the structure wasn't considered! */
	display:inline-block;
}

ol{
	margin-left:.5em;
}

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

Pixels	EMs
6px		0.375em
10px	0.625em
12px	0.750em
13px 	0.813em
14px	0.875em
16px	1.000em
18px	1.125em
20px	1.250em
24px	1.500em
------------------------------------------------------------------------------------- */

/* 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;
	border:none;
	outline:1px #61666b solid;
}


/* Headings
------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{
	font-family:'open-sans',sans-serif;
}

h1 {
    font-size:2em;
}

h2 {
    font-size:1.8em;
}

h3 {
    font-size:1.5em;
}

#pm .pbnr .bnr a.txt {
	font-size: 1em;
	color: #116fa2;
	text-align: center;
	padding: 0.5em 0;
	width: 100%;
	display: inline-block;
	font-weight: 600;
}

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{
    text-decoration: none;
    color:inherit;
}

a:hover{
    text-decoration: none;
}

a:active{
    text-decoration: none;
}

a:visited{
    text-decoration: none;
}

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

p, ol, ul, dl, address {
    font-family:'open-sans',sans-serif;
    font-size:1em;
    line-height:normal;
}

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

ol, ul {
    list-style:none;
}

ul.prompane,
ul.prompane li {
	width: 100%;
}

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

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;
}

#twitter-page
{
    width: 100%;
    float: left;
    border-top: 5px solid #00aced;
    padding: 5px 0;
    position: relative;
    display: none;
}

#twitter-page h5
{
    width: 100%;
    float: left;
    padding: 5px 0 10px 0;
}

#twitter-page img
{
    width: auto;
    float: none;
    position: absolute;
    top: 0;
    right: 0;
}


.brnds {
    width: 100%;
}

.brnds + .brnds .brnd {
    width: 100%;
    float: left;
    display: block;
    overflow: scroll;
}

.brnds + .brnds .brnd ul.links {
    position: absolute;
    /* overflow-x: scroll; */
    width: 2700px;
    float: none;
}

#pm .brnd .scroller li {
    width: 20%;
    padding-bottom: 1em;
}

#pm .brnd .scroller li a img {
	margin: 0 auto;
	width: auto;
	display: block;
}

.scroller #buttleft,
.scroller #buttright
{
    display: none;
}

/* Article typesettings 
------------------------------------------------------- */
#pm .artp h2{
	font-size:1.500em;
}
#pm .artp h3{
	font-size:1.250em;
}
#pm .artp h4{
	font-size:1.125em;
}
#pm .artp h5 {
	font-size:1.00em;
}

#pm .artp p,
#pm .artp li {
	font-size:0.813em;
	color:#807F83;
}

/*to ensure a clear break after a paragraph*/
#pm .artp p{
	margin-bottom:10px;
}

/*Unified heading colors*/
#pm .artp h2,
#pm .artp h3,
#pm .artp h4,
#pm .artp h5{
	color:#000;
}

/*to ensure spacing between a paragraph and the next heading */
#pm .artp p + h2,
#pm .artp p + h3,
#pm .artp p + h4,
#pm .artp p + h5{
	margin-top:20px;
}

/*ensures font size for a p in a table is the same as it is for text that is NOT in a p block */
#pm .artp table tr td  p{
    font-size:1em;
}

#pm .artp ul {
	list-style-type:disc;
    margin:10px 20px;
}

#pm .artp ol{
	list-style-type:decimal;
    margin:10px 20px;
}

#pm .artp img {}
#pm .artp a {}

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

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

/*special link styling if the title is correct - its cas sensitive!!! */
#pm .artp a[title='Gem Imports']{
	color:#0397d6;
}

#pm .artp a[title='Gem Imports']:hover{
	text-decoration-color:#000;
}

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

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

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

#pm .art .artp table th{
}

#pm .art .artp table th:first-child{
}

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

/* Input elements
------------------------------------------------------- */
input[type=checkbox]{
    font-size: 1em;
    line-height: 1em;
    margin: 0 0 0 0.5em;
    padding: 0;
    width: 1.25em;
    height: 1.25em;
    -webkit-border-radius: 0.25em;
    vertical-align: text-top;
}

input.submit {
	-webkit-appearance: none;
}

.inputtext{
    font-size: 1em;
    border: 1px solid #61666b;
    -webkit-backface-visibility: visible;
    -webkit-transition: opacity 200ms ease;
    -moz-transition: opacity 200ms ease;
    -ms-transition: opacity 200ms ease;
    -o-transition: opacity 200ms ease;
    transition: opacity 200ms ease;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

input.inputtext, input.inputtext_light, select.inputtext, textarea.inputtext{
    width: 88%;
    margin: .5em 2%;
    padding: .5em 2%;
}

select.inputtext{
    width: 92%;
    margin: .5em 2%;
    padding: .5em 2%;   
}

select#dobDay.inputtext,
select#dobMonth.inputtext,
#dobYear.inputtext{
    width: 25%;
}

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

.submit, #button{
	display:inline-block;
	font-weight:600;
	font-size: 1em;
	padding: .5em 1em;
	border: none;
	text-align: center;
	text-transform: uppercase;
	border-color:inherit;
	cursor:pointer;
	color:#fff;
	/* border: 1px #f0870a solid; */
	background-color: #f0870a;
	background: #1c82b9 url('https://s3-eu-west-1.amazonaws.com/kateskates/1507328/i/site/btn_arrow.png') no-repeat right 50%;
}

#pm a.btn,
#pm a.lnk {
	display:inline-block;
	font-weight:600;
	font-size:1em;
	padding:.5em 1em;
	border: none;
	text-align: center;
	text-transform: uppercase;
	border-color:inherit;
	cursor:pointer;
	color:#fff;
	border: 1px #f0870a solid;
	background-color: #f0870a;
}

a.btn[title="Continue Shopping"] {
	width: 91.5%;
	margin: 0.5em 0;
	padding: 0.3em 1em !important;
}

.checkoutdelivery .submit,
.checkout .submit{
	width:100%;
	/* background-color:#92c94e; */
}

.checkout #pm a.lnk{
	background-color:#dcdcdc;
	border-radius:0;
}

ul#searchlist li {
	width: 100%;
}

ul#searchlist li a.lnk {
	width: 92%;
	margin:0.5em 0;
}

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

table {
    /* width:100%; */
    /* font-size:1em; */
    border:1px #dcdcdc solid;
}

table thead th,
table tr.header th {
	font-size:0.813em;
	color:#fff;
	text-align:left;
	font-weight:600;
	padding:10px;
	background-color:#807f83
}

table tr td {
	padding:10px;
    vertical-align:middle;
    font-size:0.813em;
}

table tr td  p{
    font-size:1em;
}

/* -------------------------------------------------------------------------------------
=Forms 
------------------------------------------------------------------------------------- */
#pm form{
    margin: 0;
}

#pm .form .bc h3{
    width: 100%;
    padding: 8px 0;
}

#pm .form .bc ul{
    width: 100%;
    padding: 4px 0;
}

#pm .form .bc ul li{
    width: 100%;
    padding: 4px 0;
}

#pm .form .bc ul li .gender{
    clear: left;
    width: 100%;
}

#pm .form .bc ul li label{
    font-weight: bold;
    width: 80%;
    padding: 0;
}

#pm .form .bc ul li.info{
    font-size: 1.1em;
    font-weight: bold;
    padding: 8px 0 4px 0;
}

#pm .form .bc ul li.info.collectstore {
    font-weight:normal;
}

#pm .form .bc ul li.help{
    width: 95%;
    font-size: 0.9em;
    padding: 4px 0 4px 5%;
}

#pm .form .bc ul li ul.radio li input{
    width: auto;
    margin: 6px;
}

/* Also used in tables */
#pm .form .reqmsg{
    padding: 0 0 2px 0;
}

#pm .form .bc ul li.reqmsg{
    padding: 3px 0 0 0;
    font-size: 1.1em;
    color: #FF0000;
}

/* For tables in forms */
#pm .form .bc table{
    width: 100%;
    margin: 0;
}

#pm .form .bc table input.submit, #pm .form .bc table a{
    width: auto;
    margin: 0;
}

#pm form#wishlist{
    width: 39%;
}

#pm form#wishlist .submit{
    margin: 0 0 0 3%;
    width: 100%;
    padding: 8px 2px;
}

#pm form#wishlist input{
    margin: 1% 0 0 1%;

}

#pm form#wishlist label{
    width: 82%;
    padding-left: 3%;
}



/* -------------------------------------------------------------------------------------
=AccordionBase 
------------------------------------------------------------------------------------- */

#pm ul.accordion li.pane.first { 
}

#pm ul.accordion{
    margin:0;
}

#pm li.header{
	font-size: 1em;
	font-weight: 400;
	text-align: center;
	width: 96%;
	margin: auto;
	padding: .5em 2%;
	color: #FFF;
	vertical-align: middle;
	background-color:#807F83;
	border-top: 2px solid #807F83;
	border-bottom: 2px #3d4346 solid;
}

/* hide/show icons */
#pm ul.accordion li.header img{
	/*need to specify height and padding dependant on design */
    float: right;
    height:1em;
    padding-top:.25em;
    width:auto;
}

#pm ul.accordion li.header .showplus{
}

#pm ul.accordion li.header.current .showplus{
    display: none;    
}

#pm ul.accordion li.header .showminus{
    display: none;    
}

#pm ul.accordion li.header.current .showminus{
	display: block;
}

#pm ul.accordion li.pane{
    display: none; /*display is controlled by accordion jscript and inline styles */
    font-size:0.813em;
    padding:.5em;
    background-color:#dcdcdc;
    width: 96%;
}


#pm ul.accordion li.pane p{
	padding-bottom:10px;
}

#pm ul.accordion li.pane ul{
	display: block;
	margin-left:20px;
	font-size:1em;
	list-style-type:disc;
}

#pm ul.accordion li.pane li {
	width:100%;
	display: list-item;
}


/* -------------------------------------------------------------------------------------
=PanelTop 
------------------------------------------------------------------------------------- */
#pt{
    float: left;
    width: 100%;
    padding: 0;
    position:relative;
    background: #3d4346;
}

#pt ul.head{
	width:100%;
	z-index: 500;
	background-color: #3d4346;
}

#pt ul.head li{
}

#pt ul.head li.icon {
    float: left;
    width: 33.3%;
    padding: 0%;
    padding: 0.3em 0;
}

#pt ul.head li.icon a {
    width: 100%;
    text-align: center;
    float:left;
}

#pt ul.head li.icon a img {
	width:80%;
	max-width:112px; /*native image size, avoids bluring */
    height: auto;
}

#pt ul.head li.icon{
	padding-bottom: .7em;
	border-bottom: 2px #f0870a solid;
	background: #3d4346;
}

#pt ul.head li.bar{
	padding-bottom: .7em;
	border-bottom:2px #92c94e solid;
}

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

#pt ul.head li.logo {
    width: 100%;
    padding: 0;
    background-color: #fff;
    border-top: 4px #f0870a solid;
}
#pt ul.head li.logo a {
	display:inline-block;
	background-color: #3d4346;
	width: 100%;
	text-align: center;
}
#pt ul.head li.logo a img {
    /* width: 50%; */
    max-width: 126px; /*native size */
    height: auto;
    text-align:center;
    margin: 0;
}

#pt ul.head li.logolge {
    width: 100%;
    padding: 1% 0%;
    background-color: #fff;
}
#pt ul.head li.logolge a {
	float:left;
	background-color:#fff;
    width: 100%;
    text-align: center;
}
#pt ul.head li.logolge a img {
    width: 50%;
    max-width:371px; /*native size */
    height: auto;
    text-align:center;
	margin:1em 0;
}

#pt ul.head li.logolge  p{
	display:none; /*beacause we have a different header in the basket that just shoves a p tag with a phone number in it! */
}

#pt ul.head.scrolled{
	/*currently breaks the menu if you have scrolled down the page - search works though */
	position:fixed;
	top: 0;
}

#pt ul.head.scrolled li.logo{
	/*currently breaks the menu if you have scrolled down the page - search works though */
    display:none;
}

#pt ul.scrolled+#depts {
    position: fixed;
    top: 51px;
    background-color: #fff;
    overflow: scroll;
    height: 80%
}

.pagedept, #deptIntro {
	display: none;
}


/* Sign In / Members
------------------------------------------------------- */
#pt ul.head li.signin {
	/* display:none; */
	position: absolute;
	right: 1em;
	top: 0.5em;
	border-bottom: 0;
	width: 13%;
}

#pt ul.head li.signin a img {
	max-width: 40px;
	height: auto;
}

/* Search
------------------------------------------------------- */
#pt ul.head li.srch{
	position:relative;
}

#pt ul.head li.search {
    display: none;
    width:100%;
    float:left;
    background-color: #3d4346;
    border-bottom:1px #e2e2e2  solid;
}

#pt ul li.search form{
    width: 100%;
    padding: 0;
    float:left;
    text-align:center;
    margin:.5em 0;
}

#pt ul li.search form .inputtext{
	width:60%;
	background-color:#dcdcdc;
	border-color:#dcdcdc;
	color:#615e5d;
	font-size:1.2em;
	padding:0 .5em;
	margin:0;
	height:44px;
	outline:none;
	border-radius:0;
}

#pt ul li.search form .submit{
    width: 30px;
    height: 30px;
    padding: .42em;
    margin:0;
    border-radius:0;
    background-color: #f0870a;
    font-size:1.2em;
    vertical-align:bottom;
    border:none;
    background-image: none;
}

#pt ul li.search form span{
	/*hiding this as the text is rubbish! */
	float:left;
	width:100%;
	margin:.5em 0;
	display:none;
}

#pm ul li.d2 {
	background: #3d4346;
	width: 100%;
}


#pm ul li[class^="d"] a {
    float: left;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 1.5em;
    padding: 0.5em 0;
}

#pm ul li[class^="d"]:after {
    clear: both;
    content: "";
    display: block
}


/* Basket
------------------------------------------------------- */
#pt ul.head li.bskt {
    position: relative;
    text-align:center;
}

#pt ul li.bskt p {
    position: absolute;
    bottom: 0.1em;
    right: 0.2em;
    width: auto;
    margin: 0;
    padding: 1px 5px;
    background: #f0870a;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}

#pt ul.head li.bskt img {
	width:80%;
	max-width:112px;
    height:auto;
}


/* Menu / Departments
------------------------------------------------------- */
#pt ul.head li.dept{
	position:relative;
}

#pt #depts{
    display: none;
    z-index: 800;
    position: relative;
    float: left;
    width: 100%;
    max-height:95vh; /*90% of the visible screen height! */
    overflow:scroll;
}

#pt #depts ul.mobdept{
	background-color: #3d4346;
	overflow-y: auto;
	position: relative;
}

#pt #depts ul.mobdept li{
	float:left;
    overflow-y: auto;
    position: relative;
    width: 100%;
}

/* Home page links *****************************************************/

/*top level*/
ul.mobdept li a,
ul.mobdept li p {
	
width: 96%;
	
padding: 1em 0;
	
padding-left:4%;
	
color: #c6cbd0;
	
font-size: 1em;
	
font-weight: normal;
	
border-bottom: 1px solid #807F83;
	
float:left;
}

/* second level */
ul.mobdept li ul li a, 
ul.mobdept li ul li p{
    width: 94%;
    padding: 1em 0;
    padding-left:6%;
    font-size:0.875em;
}


/* third level */
ul.mobdept li ul li ul li a, 
ul.mobdept li ul li ul li p{
    width: 92%;
    padding: 1em 0;
    padding-left:8%;
    font-size:0.813em;
}

ul.mobdept li ul li ul li ul li a, 
ul.mobdept ul li li ul li ul li p{
    width: 88%;
    padding: 8px 2% 8px 10%;
    color: #ffffff;
}

ul.mobdept li a img,
ul.mobdept li p img{
    float: right;
    width:.8em;
    height:.8em;
    margin-right:1em;
 	margin-top:.2em   
}

ul.mobdept li a.dlnk{
    background-image: url('/csi/3637248/4653056/i/mob/arrowright.png');
    background-repeat: no-repeat;
    background-position: right 1em center;
    background-size:.8em;
}

/**************************/

#pm .deptprods
{
    margin-top: 2px;
    padding-top: 4px;
    position: relative;
}

#pm .deptprods h3 a
{
    width: 100%;
    color: #61666b;
}

#pm .deptprods a.seeall{
	display:none;
	vertical-align:middle;
	font-size:1em;
    overflow-x: hidden;
    overflow-y: hidden;
    color: #dcdcdc;
    text-transform: lowercase;
    width:auto;
}



/* -------------------------------------------------------------------------------------
=Breadcrumb 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=CentrePanel 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=MainPanel 
------------------------------------------------------------------------------------- */
#pm{
    width: 98%;
    padding: 1%;
    margin:0 auto ;
    clear: both;
}

.dept #pm{
	width: 92%;
	padding: 1%;
	margin:0 auto;
	clear: both;
	/* border-top: 2px #61666b solid; */
}

#pm .pbnr .bnr {
	width: 50%;
}

#pm .pbnr .bnr.bFull,
#pm .pbnr .bnr.regmob {
	width: 100%;
	margin-bottom: 0.5em;
}

#pm .pbnr .bnr img{
    max-width: 97%;
    padding: 1%;
    border: 1px solid #d9d9d9;
    border-width: 1px !important;
    height:auto;
    display: block;
    margin: 0 auto;
}

/*department textual header */

/* -------------------------------------------------------------------------------------
=Footer - comes before pb
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=Bottom Panel 
------------------------------------------------------------------------------------- */
#pb{
	background-color:#dcdcdc;
	color:#61666b;
	text-align:center;
}

#pb ul{
	margin:auto;
}

#pb ul li{}

#pb ul li.links{
	width:100%;
}

#pb li.hdr{
	text-transform:uppercase;
	/* color:#000; */
	font-weight:600;
	font-size: 1.2em;
	text-align:center;
	margin-top:.5em;
	padding-bottom:.25em;
	padding-top:.5em;
	width:80%;
	margin:auto;
}

#pb li.info {
	width:100%;
	color:#61666b;
	text-align:center;
	margin-bottom:.5em;
}
#pb li.info ul{
	margin-top:.5em;
}

#pb li.info ul li{
	width:100%;
	font-size: 1em;
	padding: 0.5em 0;
}


/*newsletter subscribe */
#pb li.news form {
    font-size: 1em;
    padding: 0.5em;
    /* border-radius: 1em; */
    text-align:center;
    border-width: 0;
    /* background: #fff; */
}

#pb li.news form input{
	border-radius:0;
}

#pb li.news form input.inputtext,
#pb li.news form input.inputtext_light{
	border:0;
	margin:0
}

#pb li.news form input:focus {
    outline: none;
}

#pb li.news form label{
	width:100%;
	padding:0;
	float:left;
	text-align:center;
	font-size:1.5em;
	margin-bottom:.5em;
}

#pb li.news form input#email{
	width: 56%;
	color:#61666b;
	font-size: 1em;
	border: 4px solid #fff;
}

#pb li.news form input#subscribe{border: 4px solid #fff;}   

/*Secure Payments */

#pb .art.spi41156608 {
}

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

/* Social */
#pb li.soc{
	padding-bottom:.5em;
}

#pb .socbook .bc{
    width: 100%;
}

#pb .socbook .bc ul{
    width: 100%;
    float: none;
    margin: 0 auto;
    text-align:center;
}

#pb .socbook .bc ul li{
    margin: .1em 2%;
    width: auto;
    display: inline-block;
    clear: none;
}

 
/* this is the email a friend that doesn't work like the other social icons! its not in an li!! */
#pb .socbook .bc ul li + a{
	display:none;
}



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


#pb li.footl,
#pb li.footr {
	width:50%;
	display:inline-block;
	vertical-align:top;
	font-size:0.625em;
	color:#fff;
	background-color:#807F83; 
	margin:0;
	padding:1em 0;
}

#pb li.footr + li {
	padding: 1em 0;
}

#pb li.footl a{
	float:left;
	margin-left:1em;
}

#pb li.footr a{
	float:right;
	margin-right:1em;
}
/* -------------------------------------------------------------------------------------
=FilterSearch 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=SearchHeader / SearchFooter 
------------------------------------------------------------------------------------- */
#pm ul li.dispord{
	width:100%;
	/* border-bottom:2px #61666b solid; */
}

#pm ul li.dispord #noofproducts{
	font-size:0.813em;
	display:inline-block;
	margin-right:1em;
}

#pm ul li.dispord form{
	display:inline-block;
}

#pm ul li.dispord select{
	width:100%;
	margin:.5em 0;
	padding:.5em;
}

.showing{
	border-bottom:2px solid #61666b;
	margin-bottom:.5em;
	padding-bottom:.5em;
}

#pm ul li.showing:after{
	/*clearfix*/
	clear:both;
	content:'';
	display:block;
}

.showing #noofproducts,
.showing #viewall{
	width:50%;
	float:left;
}

.showing #viewall{
	text-align:right;
}


#pm .showing #viewall a.lnk {
    width: auto;
    margin: 0;
    padding: 0;
    border: 0px;
    background-color:transparent;
    color: #92c94e;
    font-size: 1em;
    text-align: left;
}

/* -------------------------------------------------------------------------------------
=Department Tree 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=FeaturedProducts 
------------------------------------------------------------------------------------- */


/* Base settings
------------------------------------------------------- */

#deptlist .fprdcont,
#searchlist .fprdcont{
	display:inline-block;
	vertical-align:top;
	text-align:center;
	margin:.5em 1%;
	border-top: 1px #3d4346 solid;
	padding-top:.5em;
	margin-bottom:1em;
}

.fprd{
	position:relative;
	text-align:center;
}


/* image 
------------------------------------------------------- */
.fprd a.img{
	display:inline-block;
}

.fprd a.img img{
	width:100%;
	height:auto;
	display:block;
}


/*title */
.fprd .fprdtitle,
.fprd a.title{
	display:inline-block;
	color: #116fa2;
	text-align: left;
	font-size:0.813em;
	/* font-weight:700; */
	width: 100%;
	min-height: 54px;
}


/* ????? 
------------------------------------------------------- */
#pm .fprd a.lnk{
    width: 80%;
    margin: inherit;
    padding: inherit;;
    border: 0px;
    background-color:transparent;
    color: inherit;
    font-size: inherit;
    text-align: center;
    display:inline-block;
	border:none;
	height:2em;
}


/* pricing structure
------------------------------------------------------- */
.fprd .price, 
.fprd .rrp, 
.fprd .trade,
.fprd .qty,
.fprd .unit{
	font-size:0.813em;
	width: 100%;
	display:inline-block;
	vertical-align:top;
	margin-bottom: 5px;
	min-height: 41px;
}

.fprd .offer,
.fprd .prevprice {
	width: 50%;
	display: inline-block;
}

.fprd .price label, 
.fprd .rrp label, 
.fprd .trade label,
.fprd .qty label,
.fprd .offer label,
.fprd .prevprice label,
.fprd .unit label{
}

.fprd .price h6, 
.fprd .rrp h6, 
.fprd .trade h6,
.fprd .qty h6,
.fprd .offer h6,
.fprd .prevprice h6,
.fprd .unit h6{
	font-weight:600;
	color: #4f575c;
	font-size: 1.5em;
}

.fprd .prevprice h6{
    text-decoration:line-through
}

.fprd .offer h6{
    color: #BB283A;
}

/* clientref/model code
------------------------------------------------------- */
.fprd .clientref span{
	display:none;
}

.fprd .brand, 
.fprd .manu, 
.fprd .model,
.fprd .clientref{
	font-size:.750em;
	display:inline-block;
	width:100%;
	font-weight:normal;
}

.fprd .flag{
	position: absolute;
	top: 5px;
	right: 5px;
}

.fprd .flag img{
    /* width: 40px; */
    /* height: 40px; */
}

.fprd a.btn{
}



/* Email when back in stock
------------------------------------------------------- */
/* take care as the html markup that writes this thing out is a bit borked! */

#ewis h3{}

#ewis label{}

.fprd .ewis{
	    font-size:.8em;
}

#pm .fprd a.lnk.lnk.ewisopen {
    display:block;
    height:auto;
    background: #61666b;
    color: #fff;
    font-weight: 600;
	padding: 1%;
    text-align: center;
    text-transform: uppercase;
    width:98%;
}

.lnk.ewisopen:hover {
    text-decoration: none;
}



/* media queries
------------------------------------------------------- */
@media screen and (orientation:portrait) {
	#deptlist .fprdcont,
	#searchlist .fprdcont{
		width:48%;
	}

	.fprd .fprdtitle,
	.fprd a.title{
	}
}






@media screen and (orientation:landscape) { 
	#deptlist .fprdcont,
	#searchlist .fprdcont{
		width:23%;
	} 
	.fprd .fprdtitle,
	.fprd a.title{
		height: 4.15em; /* 3 lines - each line is */
	}

.fprd .trade{
	font-size:0.813em;
	width:100%;
	display:inline-block;
	vertical-align:top;
	margin-bottom: 5px;
}

#pm .pbnr .bnr {
	width: 33%;
}

}



/*carousel overrides */

.carousel .price{
	position:initial;
}


/* -------------------------------------------------------------------------------------
=ProductLists 
------------------------------------------------------------------------------------- */
li.prdlist{
	text-align:center;
	margin-top: 1em;
	border-top:  1px solid;
	padding-top: 0.5em;
}

li.deptprods{
    text-align:center;
	margin:1em 0;
}

li.prdlist h3{
	font-size:1.5em;
	font-weight:400;
}


li.deptprods h3{
	font-size:1.5em;
	font-weight:400;
}


/* -------------------------------------------------------------------------------------
=ProductPage 
------------------------------------------------------------------------------------- */

/* Title
------------------------------------------------------- */
.buy #pm .pititle{
    text-align:center;
}

.buy #pm .pititle h2{
	font-size:1.8em;
	font-weight:normal;
	color: #116fa2;
}


.buy .carousel{
    position: relative;
    margin:auto;
    margin:.5em 0;
}


/* Image
------------------------------------------------------- */
#pm .piimg{
    position: relative;
    width: 98%;
    margin: 0;
    padding: 1%;
    text-align: center;
}

#pm .carousel .flag{
	position:absolute;
	top:0.1em;
	right:0.1em;
	z-index: 99;
}

#pm .piimg img{
    width: 100%;
    height: auto;
}


#pm .piimg .flag{
    position: absolute;
    top: 8px;
    right: 8px;
    width: auto;
}



/* carousel stuff on product page
-----------------------------------*/
.buy #pm .carousel{
    position: relative;
    margin:auto;
    margin:.5em 0;
}







/* Buy Panel ***********************************************************/

#pm .buy
{
    position: relative;
    text-align:center;
    margin-bottom:1em;
}

#pm .buy .brandmanu {
	display:none;
}

#pm .buy .price{}

#pm .buy .price h6{
	font-family: 'Open Sans', sans-serif;
	font-size: 2em;
	color: #e47c01;
}

#pm .buy .price label{
    display: none;
}

#pm .buy .prevprice{
    width: 50%;
    float:left;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
}

#pm .buy .prevprice h6{
	width: 100%;
	text-decoration:line-through
}

#pm .buy .offer{
    width: 50%;
    float:left;
    font-size: 1.4em;
    color: #BB283A;
    font-weight: bold;
    text-align: center;
}

#pm .buy .saving{
    display: none;
}

#pm .piflags{
	width:100%;
}

#pm .piflags li{
	display:inline-block;
	max-width:40%;
	margin:0 5%;
}
#pm .piflags li img{
	width:100%;
	height:auto;
}

#pm .buy form{

}




#pm .buy form .attrqty input.submit{
	/* background-color: #f0870a; */
	display:inline-block;
	padding: .6em 3em;
	margin-bottom:1em;
	width: 93%;
}

/*youtube video link */
#pm .youtube{
	margin:.5em 0;
}


#pm .buy label#selectResponse{
    width: 100%;
    color: red;
    font-weight: bold;
}





#pm .buy {
	position:relative;
}

#pm .buy a.btn{
	margin:1em 0;
	font-size:1.2em;
	padding:.5em 1em;
	
	display:inline-block;
	width:auto;
	width:50%;
	font-size:1em;
	background-color:#dcdcdc;
	border-color:#dcdcdc;
	color:#61666b;

}

#pm ul.recprods li.fprdcont{
	width:100%;
	padding:.5em 0;
	border-bottom:1px #61666b solid;
	margin:.5em 0;
	padding-bottom:1em;
	vertical-align:middle;
	display:table;
}


/* buytogether ***********************************************************/


#pm ul.accordion.buytogether li.pane {
	display:block;
}

.buytogether  ul.boughtto{
	padding-bottom:.5em;
}

.buytogether  ul.boughtto li{
	width:90%;
	margin:.5em auto;
}

.buytogether ul.boughtto li.imgs{
}

.buytogether ul.boughtto li.imgs img{
	height:auto;
	margin:.5em;
	max-width:100px;
	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.imgs img:after{
	content:'+';
	display:block;
	width:1em;
	height:1em;
	outline:1px red solid;
}

.buytogether ul.boughtto li.prods{
	text-align:left;
	margin:.5em auto;
	margin-bottom:1em;
}

.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{
	width:10%;
	margin:0;
	
}
.buytogether ul.boughtto li.prods span.descr{
	width:70%;
}

.buytogether ul.boughtto li.prods span.price{
	float:right;
	color:##61666b;
	font-weight:600;
	width:20%;
	text-align:right;
}

.buytogether ul.boughtto li.prods:after{
	/*clearfix*/
	display:block;
	clear:both;
	content:'';	
}

.buytogether ul.boughtto li.total
{
	border-top:1px solid #61666b;
	padding:.5em 0;
	font-size:1.2em;
}


.buytogether ul.boughtto li.btn .submit{
	width:80%;
	padding:.5em;
	margin:0;
	background-color:#92c94e;
	
	display:inline-block;
	border:1px #92c94e solid;
	font-size:1.2em
}



/* buy popup hack */
.buy #mess{
	z-index:10010;
	position:absolute;
	top:0px;
	background:#fff;
	width:100%;
	text-align:center;

}

.buy #mess ul{
	width:90%;
	outline:2px #92c94e solid;
	padding:1em 4%;
}

/* personalisation ***********************************************************/
#pm .buy form .attr,
#pm .buy form .options,
#pm .buy ul.pers{
}

#pm .buy form .attr:after{
}

#pm .buy form .attr label,
#pm .buy ul.pers li label{
}


#pm ul.pers li input.inputtext,
#pm ul.pers li input.inputtext_light,
#pm .attr select{
}


#pm .buy ul.pers li span{
}

/* stock ***********************************************************/
#pm ul.stock li.header{
	border:none;
	vertical-align:middle;
	background-color:transparent;	
}

#pm ul.stock li.header .icon img{
	width: 1em;
	height:auto;
	margin-right:.5em;
}

ul.stock span{
	color:#92c94e;
	font-size:1em;
	display:inline-block;

}

/* leadtime ***********************************************************/
#pm ul.leadtime li.header{
	border:none;
	vertical-align:middle;	
}

#pm ul.leadtime li.header .icon img{
	height:1em;
	width:auto;
	margin-right:.5em;
}

ul.leadtime span{
	color:#92c94e;
	font-size:1em;
	display:inline-block;
	height:1em;
}


/* direct despatch ***********************************************************/
#pm ul.dropship li.header{
	border:none;
}

#pm ul.dropship li.header .icon img{
	width:1em;
	height:auto;
	margin-right:.5em;
}


#pm ul.dropship span.title{
	 color: #61666b;
	 font-size:1.2em;
}

/* -------------------------------------------------------------------------------------
=RecentItems 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=HoverBsket 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=Basket - Checkout 
------------------------------------------------------------------------------------- */

#pm .bskt{
}

#pm .bskt span{
	font-family:inherit;
}

#pm .bskt ul{
}

#pm .bskt ul li {
	width: 100%;
}


#pm .bskt ul li.header{
	background-color:#61666b;
	color:#fff;
	border:none;
}

#pm .bskt ul li.header .icon img{
	width:1.5em;
	height:auto;
	margin-right:.5em;
	
}
#pm .bskt .freedel ul li.header span.title,
#pm .bskt .freedel ul li.header span.icon{
	display:inline-block;
	vertical-align:middle;
}


#pm .bskt ul li.header span.icon{
	display:inline-block;
	vertical-align:middle;
}
/* basket line separator */
#pm .bskt .lines .line{
	border-bottom:1px #61666b solid;
	margin-bottom:.5em;
	padding-bottom:.5em;
}
#pm .bskt .lines .line:after{
	/*clearfix*/
	display:block;
	clear:both;
	content:'';
}

/* product image */
#pm .bskt .lines .line a.img{
	width: 25%;
	float:left;
	height:auto;
	text-align:center;
}
#pm .bskt .lines .line a.img img{
	width:100%;
	height:auto;
	max-width:80px;
}


/* Product details, title, ref, lead time, attributes */
#pm .bskt .lines .line .prodinfo{
	float:left;
	width: 50%;
	margin:.25em 0;
}

/*Product Title */
#pm .bskt .lines .line .prodinfo a{
	font-size:1.2em;
	color:#61666b;
}

/* ref, leadtime, attributes */
#pm .bskt .lines .line .prodinfo li.ref{
	display:none;
}

#pm .bskt .lines .line .prodinfo li.attr{
	display:none;
}
#pm .bskt .lines .line .prodinfo li.lead{
	font-size:.8em;
}


/*product price */
#pm .bskt .lines .line .price{
	float:left;
	width:15%;
	margin:.25em 0;
	text-align:center;
	font-size:1.1em;
}

/*remove product line */
#pm .bskt .lines .line .rem{
	float:left;
	width: 10%;
	margin:.25em 0;
	text-align:center;
}

#pm .bskt .lines .line .rem input#remove.submit{
	padding:0px;
	margin:0px;
	background:url('/csi/3637248/4653056/i/bdr/bsktremove.png') no-repeat top left;
	text-indent:-10000px;
	width:16px;
	height:16px;
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

/* gift wrap */
#pm .bskt .lines .line .giftwrap{
	float: right;
	margin:.125em 0;
	font-size:.9em;
	width: 75%;
	text-decoration:underline;
}

#pm .bskt .lines .line span +.gw_toggle{
	float:right;
}

/* gift text*/
#pm .bskt .lines .line .gifttext{
	float: right;
	margin:.125em 0;
	font-size:.9em;
	width: 75%;
	text-decoration:underline;
}

#pm .bskt .lines .line .gifttext .icon,
#pm .bskt .lines .line .giftwrap .icon{
	width:1em;
	display:block;
	float:left;
	margin-right:.5em;
}

#pm .bskt .lines .line .gifttext .icon img,
#pm .bskt .lines .line .giftwrap .icon img{
	width:100%;
	height:auto;
}



#pm .bskt .lines .line span + .gt_edit{
	float:right;
}

/*gift text entry */
.gtentry{
	float:left;
}

.gtentry .submit{
	background-color:#dcdcdc;
	font-size:1em;
	border:1px #dcdcdc solid;
	margin:.5em
}

#pm .bskt .lines .line .qty{
	float:left;
	width:100%;
	position:relative;
}

#pm .bskt .lines .line .qty form{
	float:left;
	width: 52%;
	float:left;
	height:auto;
	margin:.25em;
}

#pm .bskt .lines .line .qty label{
	width:auto;
	vertical-align:middle;
	margin-top:.5em;
	float:left;
}

#pm .bskt .lines .line .qty button.skuqtybsktsub{
	outline:none;
	border:none;
	float:left;
	padding:0px;
	margin:0px;
	margin-top:.1em;
	background:url('/csi/3637248/4653056/i/bdr/skuDecrease.png') no-repeat top left;
	text-indent:-10000px;
	width:13px;
	height:26px;
}
#pm .bskt .lines .line .qty input{
	float:left;
	width:2em;
	margin:0 .5em;
	text-align:center;
}

#pm .bskt .lines .line .qty button.skuqtybsktadd{
	outline:none;
	border:none;
	float:left;
	padding:0px;
	margin:0px;
	margin-top:.1em;
	background:url('/csi/3637248/4653056/i/bdr/skuIncrease.png') no-repeat top left;
	text-indent:-10000px;
	width:13px;
	height:26px;
}


/*sub total*/
#pm .bskt .prodsubtotal{
	border-bottom:1px #61666b solid;
	margin:.5em 0;
	padding:.5em 0;
}

#pm .bskt .prodsubtotal li.subtotal label{
	width:25%;
	float:left;
	max-width:80px;
	height:auto;
	margin:.25em;
	padding:0;
	text-align:right;
}

#pm .bskt .prodsubtotal li.subtotal span{
	width:70%;
	float:left;
	height:auto;
	margin:.25em;
	padding:0;
	text-align:right;
	font-weight: 600;
}

/*free shipping */
#pm .bskt .freedel ul li.header{
	background-color:#fff;
	color:#92c94e;
}

/*shipping - postcode finder */
#pm .bskt div.shipping{
	width: 98%;
	float:left;
	margin:0 1%;
}


#pm .delivery deliveryto


#pm .bskt .shipping form{
	width:100%;
	float:left;
	margin:0;
}

#pm .bskt .shipping span{
	color:#3f6977;
}
#pm .bskt .shipping .deliverto span{
	display:none;
}

#pm .bskt .shipping form input[type='text']{
	border-radius:0;
	width:75%;
	float:left;
	text-align:center;
	margin-right:0;
}

#pm .bskt .shipping form input[type='submit']{
	background-color:#92c94e;
	border-radius:0;
	width: 15%;
	font-size:1em;
    margin: .5em 2%;
    padding: .5em 2%;
    margin-left:0;
	float:left;
	border:1px #92c94e solid;
}


#pm .bskt .shipping .ship_edit{
	text-decoration:underline;
	color:#3f6977;
}


/* vouchers 
------------------------------------------------------- */

#pm li.vouch{
	text-align:center;
	border-bottom:2px #61666b solid;
	margin-bottom:1em;
	width:100%;
	float:left;

}

#pm ul li.vouch .header{
	background-color:#92c94e;
	width: 96%;
}

#pm ul li.vouch .pane{
	margin-bottom:1em;
}
#pm ul li.vouch input{
	text-align:center;
}


#pm ul li.vouch .submit{
	background-color:#3f6977;
	color:#fff;
	border-radius:.25em;
	width:93%;
}

/*basket totals */
.bskttotals{
	float:left;
	width:100%;
}

.bskttotals .subtotal{
	float:left;
	width: 100%;
	margin: .25em 0%;
}

.bskttotals .subtotal label{
	float:left;
	width:auto;
	font-size:1.2em;
}
.bskttotals .subtotal span{
	float:right;
	font-size:1.2em;
}

.bskttotals .total{
	text-align: right;
	margin-bottom:1em;
	width: 100%;
}

.bskttotals .total label{
	width:auto;
	font-size:1.4em;
	/* color:#3f6977; */
	float: left;
	font-weight: 600;
}

.bskttotals .total span{
	font-size:1.4em;
	color: #f0870a;
	font-weight: 600;
}


/* payment options 
------------------------------------------------------- */
#pm .bskt .basketlinks{
	text-align:center;
	margin-top:1em;
}

/*sagepay */
#pm .bskt .sp_button{
}

#pm .sp_button a{
    background-color: #f0870a;
    margin: 0px;
    padding:.5em 1em;
    width: 91%;
}

/*paypal*/
#pm .bskt .pp_button{
	width:100%;
	text-align:center;
	margin:.5em 0;
}

#pm .pp_button a{
    padding: 0;
    background: transparent;
}

/*amazon*/
#pm .bskt #LoginWithAmazon,
#pm .bskt #LoginWithAmazon1{
	width:100%;
	text-align:center;
}

#pm #LoginWithAmazon img{
}


/*continue shopping*/
#pm .bskt .ct_button{
	margin:1em 0;
}

#pm .ct_button a{
	font-size:1em;
    margin: 0px;
    padding:.5em 1em;
    
    width:50%;
}

#pm .bskt .basketlinks span{
	display:none; /*because of reasons - like having the word 'or' on the image!!!*/
}

/*Empty Basket Styling */
#pm ul.bskt li.empty{
	background-color:#e3e8eb;
}

#pm ul.bskt li.empty .header{
	/* outline:1px red solid; */
	background-color:transparent;
	color:#92c94e;
}

#pm ul.bskt li.empty .total{
	text-align:center;
	font-size:1.5em;
}
#pm ul.bskt li.empty .cont{
	text-align:center;
	margin:.5em;
	padding:.5em;
}

#pm ul.bskt li.empty .cont a.btn{
	background-color:#92c94e;
	
	padding:.5em 2em;
}


/*checkout header articles */

.checkoutHeader{
	float:left;
	width:100%;
	margin-bottom:.5em;
	
}

#pm .art.checkoutHeader .bc img{
	float:left;
	display:block;
	max-height:60px;
	max-width:40%;
	width:auto !Important;
	margin-left:1em;
}

#pm .art.checkoutHeader .bc img:nth-child(2n){
	float:right;
	display:block;
	max-height:60px;
	max-width:40%;
	margin-right:1em;
	width:auto !Important;
}

/*checkout breadcrumb */
.chkcrumb{
	float:left;
	width:100%;
	text-align:center;
	vertical-align:middle;
	margin-bottom:1em;
	margin-top:1em;
}

.chkcrumb:after{
	content:'';
	background-color:#61666b;
	height:.25em;
	width:75%;
	margin:auto;
	position:relative;
	top:-2.8em;
	z-index: 0;
}

.chkcrumb li{
	display:inline-block;
	width:25%;
	vertical-align:middle;
	text-align:center;
}

.chkcrumb li span.numbers{
	color:#fff;
	background-color:#61666b;
	width:2em;
	height:2em;
	font-size:1.2em;
	border-radius:1em;
	line-height:2em;
	display:block;
	margin:auto;
	position:relative;
	z-index: 21;
}

.chkcrumb li span.text{
	display:block;
	margin:auto;
	padding-top:.25em;	z-index:10;

}

.chkcrumb li.curr{
}


.chkcrumb li.curr span.numbers{
	background-color:#92c94e;
}


/* checkout sign in - stage 2 */
.checkoutsignin #pi_wrapper{
	float:left;
}


.checkoutsignin #pi_wrapper ul.pi_tabs li{
	width: 49%;
	float:left;
	clear:none;
	margin:0;
	padding:.5em 0;
}

.checkoutsignin #pm .pi_tab_content{
    position: relative;
    display: inline;
    width: 95%;
    margin: 0;
    padding: 2%;
    z-index: 0;
    border:none;
    float:left;

}

.checkoutsignin #pm .pi_tab_content h3{
	text-transform:uppercase;
	text-align:center;
	font-weight:normal;
}

.checkoutsignin #pm .pi_tab_content input.inputtext{
	border-radius:0;
}

.checkoutsignin #pm .pi_tab_content input.submit{
	background-color:#92c94e;
	border-radius:.25em;
	width:100%;
}


/* stage 3 delivery details */


/* confirmation */
.confirmation .conf,
.confirmation .artp,
.confirmation .art{
	text-align:center;
}
.confirmation .order{
}

.confirmation #pm ul.conf li.header{
	border:none;
	font-size:3em;
	color:#92c94e;
	font-weight:600;
	margin:0;
	padding:0;
	width:100%;
}

.confirmation .conf li{
	margin-bottom:.5em;
	font-size:1.2em;
}
.confirmation .conf li.subhead{
	color:#92c94e;
	font-size:2em;
	border:none;
}

.confirmation .line{
	float:left;
	width:100%;
	border-bottom:1px #61666b solid;
	margin-bottom:1em;
	padding-bottom:.5em;
}

.confirmation .line a.img{
	width:25%;
	float:left;
	max-width:80px;
	height:auto;
	margin:.5em;
}

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

/* Product details, title, ref, lead time, attributes */
.confirmation .line .descr{
	margin:.5em 0;
	float:left;
	width: 50%;
	text-align:left;
}

/*product price */
.confirmation .line .price{
	float:right;
	width:20%;
	margin:.25em 0;
	text-align:center;
	font-size:1.1em;
}


/*Product Title */
.confirmation .line .prodinfo a{
	font-size:1.2em;
	color:#3f6977;
}

/* ref, leadtime, attributes */
.confirmation .line .prodinfo li.ref,
.confirmation .line.prodinfo li.lead,
.confirmation .line .prodinfo li.attr{
	font-size:.8em;
}


/*product price */
#pm .bskt .lines .line .price{
	float:left;
	width:15%;
	margin:.25em 0;
	text-align:center;
	font-size:1.1em;
}

/*sub total*/
.confirmation .subtotal{
	width:100%;
	float:left;
}

.confirmation  li.subtotal label{
	width:25%;
	float:left;
	height:auto;
	margin:.25em;
	padding:0;
	text-align:left;
}

.confirmation li.subtotal span{
	width:70%;
	float:left;
	height:auto;
	margin:.25em;
	padding:0;
	text-align:right;
}

.confirmation .subhead{
	border-top:2px #61666b solid;
	float:left;
	width:100%;
	text-align:center;
	font-size:1.5em;
	margin:.5em 0;
	padding-top:.5em;
}


.confirmation .address{
	float:left;
	text-align:center;
	width:100%;
}

.confirmation .inst{
	float:left;
	width:100%;
	text-align:center;
	margin-bottom:1em;
	border:none;
}
/* -------------------------------------------------------------------------------------
=Checkout process Need !important to override jquery ui 
------------------------------------------------------------------------------------- */

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

/* Postcode lookup   
------------------------------------------------------- */

#pm .pclup{
    /* text-align: center; */
}

#pm .pclup #btnPostCodeLookup{
	width:98%;
	background-color:#92c94e
}


#pm .pclup #pclupManualAddress{
	text-align:center;

	width:100%;
	float:left;
	margin:.5em 0;
}

#pm .pclup select{
    margin: 4px 0 0 0;
    width: 96%;
}

#pm .pclup span.or{
    display: none;
}

#pm #pclupManualAddress{
    float: none;
    cursor: pointer;
    text-decoration: underline;
}

#pm #divAddressShowHide{

}

#pm #deliveryInst{
	margin-bottom:0;
}
#pm #spandeliveryInst{
	padding:0px;
	margin:0px;
	width:100%;
	float:left;
	margin-bottom:.5em;
	text-align:center	;
}

#pm #divAddressShowHide li:first-child{
    color: #4A4B4A !important;
}

/* Accordion tabs 
------------------------------------------------------- */
/* Specific Fields 
------------------------------------------------------- */
/* Confirm Basket 
------------------------------------------------------- */
/* Payment 
------------------------------------------------------- */
/* Anchor buttons 
------------------------------------------------------- */
/* Breadcrumb pane 
------------------------------------------------------- */

#pm .checkoutcrumb li:after{
	/*clearfix*/
	display:block;
	clear:both;
	content:'';	
}

#pm .checkoutcrumb ul{
    border: 2px solid;
}

#pm .checkoutcrumb li{
    width: 20%;
    float:left;
    text-align: center;
}

#pm .checkoutcrumb li p.num{
    width: 70%;
    margin: 0 10%;
    padding: 6px 0;
    border: 2px solid;
    font-size: 1.6em;
    color: #999999;
    background-color: #E6E6E6;
}

#pm .checkoutcrumb li.curr p.num{
    color: #ffffff;
    background-color: #999999;
}

/* checkout - personalisation  
------------------------------------------------------- */

#pm .pgift ul li{
    margin-top: .5em;
    float:left;
    width:100%;
}

#pm .pgift ul li:last-child{
    margin-top: .5em;
    border-top: 2px #ccc solid;
}

#pm .pgift ul li.prod{
    padding-top: .5em;
    border-top: 2px #ccc solid;
}

#pm .pgift ul li.prod .img{
    float: left;
    width: 40%;
    max-width:100px;
    margin:.5em;
    /* text-align: center; */
}

#pm .pgift ul li.prod .img img{
	width:100%;
	height:auto;
}

#pm .pgift ul li.prod p{
    float:left;
    width:50%;
    margin:.5em;
}

#pm .pgift ul li.itemno{
    padding-top: .5em;
    font-weight: bold;
}


/* checkout - shipping options
------------------------------------------------------- */
li.delivery{
}

li.shipping,
li.shipping p {
	width: 100%;
}

li.shipping p span {
	float: right;
}

li.delivery  h4,
li.delivery input{
	float:left;
}


/* Order info 
------------------------------------------------------- */
/* terms and conditions article in checkout
------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=Sitemap 
------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------
=Messages 
------------------------------------------------------------------------------------- */
/* OOS and DDS popup 20/11/14 */
.outofstockdialog,
.directdespatchdialog {
    width: 90% !important;
    position: fixed !important;
    top: 160px !important;
    padding: 20px 0;
    float: none;
    border: 3px solid #fff;
    background: #dcdcdc;
    color: #fff;
    text-align: center;
    font-family: 'Open Sans', sans-serif;
    -webkit-box-shadow: 1px 1px 18px 2px rgba(50, 50, 50, 0.8);
    -moz-box-shadow:    1px 1px 18px 2px rgba(50, 50, 50, 0.8);
    box-shadow:         1px 1px 18px 2px rgba(50, 50, 50, 0.8);
}

.outofstockdialog .outofstockpopup,
.directdespatchdialog .directdespatchpopup{
    width: 100% !important;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow:    none;
    box-shadow:         none;
}

.outofstockdialog  span,
.directdespatchdialog span{
    float: none;
}

.outofstockdialog .outofstockpopup .oosheader,
.directdespatchdialog .ddheader{
    padding: 0 0 4px 0;     
}


.outofstockdialog .outofstockpopup .oosmessage,
.directdespatchdialog .ddmessage{
    padding: 10px 0;
}

.outofstockdialog .outofstockpopup .oosmessage .oosdate,
.directdespatchdialog .dddate{
    font-weight: 800;
    width: 100%;
    clear: left;
    padding-top: 4px;
}

.ui-dialog-titlebar{
    /* display: none; */
}

.outofstockdialog .ui-widget-content{
    background: transparent;
    border: none;
    margin-top: 0;
    clear: none;
}

.outofstockdialog .ui-widget-content .ui-dialog-buttonset button,
.directdespatchdialog .ui-widget-content .ui-dialog-buttonset button{
    background: #fff;
    color: #006672;
    font-size: 13px;
    margin-right: 3%;
    padding: 6px;
    font-weight: 800;
    border: none;
}

/* -------------------------------------------------------------------------------------
=Autocomplete 
------------------------------------------------------------------------------------- */
.ui-autocomplete{
	background-color:#fff;
	left:0px !important; /*to override inline style*/
	padding:.5em 0;
}

.ui-menu-item{
	width: 96%;
	margin:.5em auto;
	border: 1px #61666b solid;
	padding:.25em;
}

.foundProduct{
	float:left;
	height:80px;
	margin:0 1em;
}

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

.foundProductTitle {
	color: #116fa2;
}

.foundProductRef{
	float:left;
	font-size:.8em;
	color: #f0870a;
}

.foundProductDesc{
	/*nothing is written out here anyway, being used as a clearfix */
	clear:both;
	content:'';
	display:block;
}
.foundProductDesc:after{
	/*if there ever is stuff written out then this works as a clearfix */
	clear:both;
	content:'';
	display:block;
}

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

#pm .art .bc img{
	/*why????*/
    max-width: 100%;
    height: auto !important;
}

#pm ul li .art{
    border-bottom: none;
}

#pm ul li .art .bc .artp ul, 
#pm ul li .art .bc .artp p ul{
    width: 95%;
    padding: .5em;
    list-style: disc;
}

#pm .artf{
    width: 90%;
    padding: 0 5%;
}

#pm ul li .art.soc {
	width: 100%;
	padding: 0.5em 0;
}

#pm ul li .art.soc .bc a {
    margin: 0px 10%;
}

#pm ul li .art.soc .bc a:last-of-type {
    margin-right: 0;
}

#pm .art.freedel,
#pm .art.freedel .bc {
    width: 100%;
    float: left;
}

#pm .art.freedel p
{
    font-size: 1.2em;
    font-weight: 600;
    /* font-family: 'octin-stencil', sans-serif; */
    color: #3d4346;
    width: 100%;
    float: left;
    text-align: center !important;
    margin: 0;
}


/* Dept CTA's' */

#deptCTA
{
    width: 100%;
    float: left;
    
}

#deptCTA .deptCTAqtr
{
    width: 100%;
    /* float: left; */
    padding-bottom: 10px;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
    display: inline-block;
}

#deptCTA .deptCTAqtr h2
{
    border-top: 1px solid #ccc;
    background-image:url(https://s3-eu-west-1.amazonaws.com/kateskates/1507328/i/site/bg_filter_inline.png);
    width: 95%;
    padding: 8px 0 8px 5%;
}

#deptCTA .deptCTAqtr img
{
    display: block;
    margin: 0 auto;
}

#deptCTA .deptCTAqtr .ctatxt p 
{
    width: 100%;
    text-align: center !important;
}

#deptCTA .deptCTAqtr .ctatxt ul
{
    list-style: none !important;
    padding: 5px 0 5px 5% !important;
    width: 95% !important;
}

#deptCTA .deptCTAqtr .ctatxt ul li
{
    background: url(https://s3-eu-west-1.amazonaws.com/kateskates/1507328/i/site/arrow_more.png) no-repeat left 5px;
    width: 90%;
    padding: 5px 0 5px 6%;
}

/*typography */




/* ARTICLES
------------------------------------------------------- */
.deptHeader{
	margin-bottom:10px;
}

.deptHeader img{
	display:inline-block;
	vertical-align:middle;
	margin-right:20px;
}

.deptHeader .artp{
	display:inline-block;
	vertical-align:middle;
	/* width: 500px; */
	/* text-align:center; */
}

.deptHeader .artp h2{
	font-size:0.938em;
}

.deptHeader .artp p{
	margin-bottom:10px;
}


.deptHeader .artp b,
.deptHeader .artp strong{
	font-size:1.05em;
}




.deptFooter{
	margin-top:10px;
}

.deptFooter img{
	display:inline-block;
	vertical-align:middle;
	margin-right:20px;
}

.deptFooter .artp{
	display:inline-block;
	vertical-align:middle;
}

.deptFooter .artp h2{
	font-size:0.938em;
}

.deptFooter .artp p{
	margin-bottom:10px;
}


/* -------------------------------------------------------------------------------------
=MyAccount
------------------------------------------------------------------------------------- */
.myaccount ul{
	text-align:center;
}

.link{
	text-align:center;
}

/*view order button image change hack */
.orderinfo #pm a.btn[title='View']{
	margin:0;
	font-size:1em;
	border:none;
	padding:0em;
	display:inline-block;
	width:2.5em;
	height:2.5em;
	background:url('/csi/3637248/4653056/i/btn/search.png') #61666b no-repeat center;
	background-size:50%;
}

.orderinfo #pm a.btn[title='View'] img{
	display:none;
}


.orderinfo #pm ul li  label{
	float:left;
	font-weight:600;
}


.orderinfo #pm ul li span {
    float: right
}

/* -------------------------------------------------------------------------------------
=CustomArticles / Promotions
------------------------------------------------------------------------------------- */
#pm .deptstd .bc img{
    /* display: none; */
    float:right;
    max-width:80px !important;;
}

#pm .deptstd .bc p{
    margin-bottom: 5px;
}

.moreless .header{
	display:none;
}

.moreless .pane{
	overflow:hidden;
	height:100px;
	position:relative;
}

.moreless .pane.expand{
	height:auto;
}

.moreless .showmore,
.moreless .showless{
	width:100%;
	text-align:right;
	color:#0397d6;
	background-color:#fff;
	position:absolute;
	bottom:0px;
}


/*home page banners */


.home .pbnr .bnr{
	display:inline-block;
	vertical-align:top;
}

.home .pbnr .bnr.m480{
	width:100%;
}

@media screen and (orientation:portrait) {
	.home .pbnr .bnr.m480{
	width:100%;
	}
}
@media screen and (orientation:landscape) { 
	.home .pbnr .bnr.m480{
	width:40%;
	float:left;

	} 
	#deptCTA .deptCTAqtr {
		width: 49%;
	}
}



@media screen and (orientation:portrait) {
	.home .pbnr .bnr.m240{
	width:50%;
	}
}
@media screen and (orientation:landscape) { 
	.home .pbnr .bnr.m240{
		width:20%;
		float:left;

	} 
}




/* -------------------------------------------------------------------------------------
=Blog
------------------------------------------------------------------------------------- */

#site.blog #pm {
    width: 96%;
    margin: 0% 2%;
}

#site.blog #pm h2 {
    font-size: 1.4em;
    text-align: center;
    margin-bottom: 2%;
}

#site.blog #pm .blog {
display:inline-block;
    clear: both;
    padding-bottom: 2%;
    margin-bottom: 4%;
    background: #e3e9eb;
}

#site.blog #pm .blog a.title {
    float: left;
    width: 94.9%;
    padding: 1% 2%;
    font-size: 1.1em;
    text-align: left;
    color: #0397d6;
    font-weight:bold;
}

#site.blog #pm .blog p.date {
    float: left;
    width: 96%;
    margin: 0% 2%;
    padding: 1% 0% 0%;
    color: #009fe3;
}

#site.blog #pm .blog img {
    float: left;
    width: 46% !important;
    height: auto !important;
    margin: 2% 2% 0%;
}

#site.blog #pm .blog .artp {
    float: right;
    width: 48%;
    margin-right: 2%;
}

#site.blog #pm .blog a.more {
    float: right;
    clear: both;
    margin: 2% 2% 0%;
    padding: 1% 2%;
    font-size: 1.1em;
    text-align: right;
	background-color: #0397d6;
	text-align: center;
	color: #fff;
}


#site.blog #pm .blogBtns, 
#site.blog #pm .blogPageBtns {
    display:inline-block;
    width: 100%;
    margin-bottom: 2%;
}

#site.blog #pm .blogBtns a, 
#site.blog #pm .blogPageBtns a {
    display: block;
    padding: 1% 2%;
    font-size: 1.1em;
    text-align: right;
}

#site.blog #pm .blogBtns a.prev, 
#site.blog #pm .blogPageBtns a.prev {
    float: left;
    border:2px solid #61666b;
}

#site.blog #pm .blogBtns a.next, 
#site.blog #pm .blogPageBtns a.next {
    float: right;
    border:2px solid #61666b;
}

#site.blog #pm .art .bc h2 {
    float: left;
    width: 94.9%;
    margin-bottom: 0%;
    padding: 1% 2%;
    font-size: 1.1em;
    text-align: center;
}

#site.blog #pm .art .bc .artp {
    float: left;
    width: 96%;
    margin: 0% 2%;
}

#site.blog #pm .art .bc .artp h3 {
    text-align: left;
}


/* -------------------------------------------------------------------------------------
=OwlCarousel/ Jquery Hacks 
------------------------------------------------------------------------------------- */
/* base settings */
.carousel{
    position: relative;
    margin:auto;
    margin:.5em 0;
}

.owl-controls{
	width:100%;
	position:absolute;
	top: 36%;
	height:0; /*hack to ensure you can tap on the image that is beind it */
}

.slide .owl-controls,
.dept .owl-controls {
	display:none;
}

.owl-nav .owl-prev,
.owl-nav .owl-next{
    color: #fff;
    font-size: 1.2em;
    padding:.25em;
    line-height:1.1em;
    background: #f0870a;
    border-radius:30px;
    width:1em;
    height:1em;
    text-align:center;
    /* display: none !important; */
}

.owl-nav .owl-prev{
	float:left;
}

.owl-nav .owl-next{
	float:right;
}

.owl-dots .owl-dot{
	display:none;
}

.owl-dots .owl-dot{
	background-color:#fff;
	border:2px #61666b solid;
	border-radius:1em;
	width:1.2em;
	height:1.2em;
	display:inline-block;
	margin:0 .5em;
}

.owl-dot.active{
	background-color:#61666b;	
}

.owl-theme .owl-item img{
    display: block;
    width: 100% ;
    height: auto;
}

/* home page overrides */
.hpslider .owl-controls{
	display:none;
}

.home .owl-dots .owl-dot{
	display:none;
}



/* dept prods carousel is different to prdlst so need to hack things again */
li.deptprods .carousel .owl-controls .owl-dots{
	display:none !important;
}

/* buy page/product page overrides */
.buy .owl-controls{
	position:initial;
}

.buy .owl-nav{
	display:none;
}

.buy .owl-dots{
	width:100%;
	margin-top:1em;
	text-align:center;
	margin-bottom:1em;
	float:left;
}

/* -------------------------------------------------------------------------------------
=Hacks 
------------------------------------------------------------------------------------- */

.checkoutLogos { /*remnant of old code/layout*/
	display:none;
}
#pm .socbook{
	display:none !important;
}

#pm .socbook +ul{
	display:none !important;
}

ul#deptlist + ul{
	width:100%;
	text-align:center;
	display:inline-block;
	margin:1em 0;
}

/*UNSORTED CSS */




/* Tab Panel ***********************************************************/

#pi_wrapper{
    margin: 3px 0;
}

#pm ul.pi_tabs{
    border: none;
}

#pm ul.pi_tabs li{
    display: block;
    position: relative;
    cursor: pointer;
    width: auto;
    margin: 0 5px 0 0;
    padding: 8px 10px;
    text-align: center;
    font-weight: bold;
    z-index: 20;
    border: 1px solid #E5E5E5;
    background-color: #F6F6F6;
}

#pm ul.pi_tabs li.selected{
    background-color: #ffffff;
    border-bottom: 1px solid #ffffff;
}

#pm .pi_tab_content{
    position: relative;
    display: inline;
    width: 95%;
    margin: -1px 0 0 0;
    padding: 2%;
    z-index: 0;
    border: 1px solid #E5E5E5;
    background-color: #ffffff;
}

#pm .pi_tab_content ul{
    border: none;
}

/* Reviews *************************************************************/

#pm ul.reviews{
    margin: 3px 0 0 0;
}

#pm ul.reviews li{
    margin: 0 0 3px 0;
}

#pm ul.reviews li.title{
    width: 95%;
    margin: 0;
    padding: 0 0 0 5%;
    font-weight: bold;
}

#pm ul.reviews li.byline{
    width: 95%;
    margin: 0;
    padding: 0 0 0 5%;
}

#pm ul.reviews li.review{
    width: 90%;
    margin: 0;
    padding: 0 0 0 10%;
}

/* Subscribe */
#pm #email{
    padding: 6px 0;
}

#pm #subscribe{
    margin: 0px 2% 5px 2%;
    /*
    width: 30%;
    breaks checkout page */

}


/* -------------------------------------------------------------------------------------
=Jquery Base Overrides 
------------------------------------------------------------------------------------- */
.ui-dialog,
.ui-widget.ui-widget-content
 {
    background-color: #fff;
    z-index: 2000;
    padding: 1em;
    -webkit-box-shadow: 10px 10px 5px 0 rgba(0,0,0,0.25);
    -moz-box-shadow: 10px 10px 5px 0 rgba(0,0,0,0.25);
    box-shadow: 10px 10px 5px 0 rgba(0,0,0,0.25);
    border: 2px #416976 solid;
    border-radius:0px;
    /* display: block !important; */
}

.ui-widget {
    font-size: 1em;
    font-family: 'Lato', sans-serif;
}

.ui-widget-header{
	background:none;
	border:none;
	color:#416976;
	font-size:1em;
}

.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 {
    border: none;
    background: none;
}

/***********************************************************************/

.checkoutLogos{
    float:left;
}

#pm .art.checkoutLogos .bc img{
    width:45% !important;
    padding:2.5%;
    height:auto !important;
}
/* -------------------------------------------------------------------------------------
=Hacks 
------------------------------------------------------------------------------------- */
.clearfix{
	padding:0 !important;
	margin:0 !important;
	float:none !important;
    clear:both !important;
}

.spacer{
	float:left;	
}

#dynpricejaq 
{
	display: none;
}

fieldset {
	margin: 0.5em 0;
}

fieldset input,
fieldset label {
	width: 98%;
	display: inline-block;
}

fieldset input {
	padding: 1em 0;
}

fieldset textarea {
	max-width: 89%;
}

.nosto_element {
	display: none !important;
}
.soc div {
	display: inline-block;
	padding: 0em 1.5em 0em 1.5em;
}

#pc {
	float:left;
}

#pc #a109412355 .artp{
	padding:.5em;
	background-color:#f0870a;
	margin-top:1em;
	/* display:block; */
	/* float:none; */
}

#pc #a109412355 .artp p{
	color:#fff;
	text-align:center;
	margin:0;
	font-weight:600;
	font-size:1.2em;


}