/* =====================================

          OPS PRINT STYLES 

========================================

* This stylesheet is exclusively for styles for the print products section. Don't cross the streams!
* Please do not edit this file, unless you wish to make a global change for all websites that use one of the OPS child themes.
* If you are unsure, please contact Laura Wheatman or Francis Whiteley or email us at projects@flex4.co.uk
*/

#content a.listing-category-name{
	display: block;
	font-size: 1.5rem;
	color:#000;
}
#content a.listing-category-name:visited{
	color:#000;
	text-decoration: none;
}

/*==============================================================================
OPS STYLES
===============================================================================*/


/* ================ OPS CATALOGUE ===============*/
.listing-category-image img, .listing-product img, .listing-template img {max-width: 99.99%;height:auto;display: block;}
.listing-template img { border: 1px solid #ddd; }
.listing-product {margin-bottom: 30px;}
.listing-product-name {text-decoration:none;}
.listing-product-name, .listing-category-name, #designs .listing-name { font-weight: bold; font-size: 1.1rem; margin: 6px 0 12px 0; display:block; }
.productdesc {margin-bottom:1em;}
.listing-category-int, .listing-product-int { display: block; }
div.prod_text .form-submit { margin-left:0; }
.listing-category-shortdesc {
margin-bottom:1rem;
}

.p-matrix-group {display:none;}

.template-tab-head {
    display: inline-block;
    width: 100%;
    margin-bottom: 1rem;
}
div#templates h2 {
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}
div#templates .checkout-action {
    display: inline-block;
    float: right;
    margin: 0;
}

.vat-small,
.tot-mat .vat-small span.CurrencySymbol{
	font-size:0.9rem;
	font-weight:normal;
	color:#333;
	display:inline-block;
}


/* ================ OPS MY ACCOUNT ===============*/

#myaccount { padding:0 15px; }
.search-orders{ margin-bottom:20px; }
.myaccount-action a{
	padding:10px 20px;
	color:#FFF;
}
.myaccount-action a:visited, .myaccount-action a:hover{
	color:#FFF;
}
#myaccount .cartbox-checkout .checkout-action a.cta{
	margin-top:1rem;
	text-decoration:none;
}

#myaccount .boxcontent p,
#checkout .boxcontent p{
	margin:0.5rem 0;
}

.login-forgotpassword input[type="submit"] {
    border: none;
    background-color: transparent;
    padding: 0;
    margin: 0;
    line-height: 2rem;
}

.login-forgotpassword input[type="submit"]:hover{
	text-decoration:underline;
	color:#000;
}

a#reset-password{
	color:#333;
	display:inline-block;
	padding:10px 0;
}
@media screen and (max-width: 480px) {
	.formlabel,
	.formfield{
	width:100%;
	display:block;
	}
}

.re-order.cart-container section.greysection{
  background-color: transparent;
  padding: 0;
}

.re-order.cart-container .w-container,
.re-order.cart-container .cart-container{
  padding: 0;
}
/* ================ MYACCOUNT STOCK ===============*/
#stockform input[type="number"]{
	min-width: 123px;
    padding: 10px;
}
/* ================ OPS FORM STYLES ===============*/

input, select {
border: 1px solid #e3e3e3;
padding: 5px;
color: #2e3a3f;
max-width: 99%
}
select { max-width: 99% }

/* ================ OPS GENERIC STYLES ===============*/

.text-left { text-align:left; }
.text-right { text-align:right; }
.text-center { text-align:center; }
.border-none { border:none; }
.width-10 { width:10%; }
.width-15 { width:15%; }
.width-20 { width:20%; }
.width-25 { width:25%; }
.width-30 { width:30%; }
.width-40 { width:40%; }
.width-45 { width:45%; }
.width-50 { width:50%; }
.width-60 { width:60%; }
.width-70 { width:70%; }
.width-80 { width:80%; }
.width-90 { width:90%; }
.width-100 { width:100%; }
.margin0px{	margin: 0px; }
.padding0px{ padding: 0px; }
.padding5px { padding:5px; }
.padding3px { padding:3px; }
.valigntop{ vertical-align:top; }
.border-left-dotted{ border-left: 1px dotted #CCC; }
.border-left-solid{ border-left: 1px solid #CCC; }
.border-right-dotted{ border-right: 1px dotted #CCC; }
.border-right-solid{ border-right: 1px solid #CCC; }
.border-bottom-solid{ border-bottom: 1px solid #CCC; }
.border-bottom-solid{ border-bottom: 1px dotted #CCC; }
.error { color:#FF0000; }
.small-text { font-size: 0.8em;}


/* data styles */

.datatable {
  width:100%;
}
.datatablehead, .datatablehead-borderleft, .datatablesubhead, .datatablesubhead-borderleft {
  background:#6B6B6B;
  color:#FFF;
  font-weight:bold;
  padding:5px 5px 5px 10px;
  line-height:1.8;
}
.datatablehead, .datatablehead-borderleft {
  font-size:1.2em ;
}
.datatablesubhead, .datatablesubhead-borderleft {
  font-size:1.1em ;
}
.datatableheadaddbutton{
  background:#6B6B6B;
  color:#FFF;
  font-weight:bold;
  padding:5px;
  text-align:right;
  border:none;
  width:100px;
}
.datatablecolumns {
  background:#E6E6E6;
  font-weight:bold;
  padding:5px 5px 5px 10px;
}
.datatablesubcolumns {
  background:#ebf5fe;
  padding:5px 5px 5px 10px;
}
.datatableparentcolumns {
  background:#A4A4A4;
  color:#FFF;
  font-weight:bold;
  padding:5px 5px 5px 10px;
}
.datatablechildcolumns {
  background:#E6E6E6;
  font-weight:bold;
  padding:5px 5px 5px 40px;

}
.datatablecell, .datatablecell-borderleft, .datatablecell-select, .datatablecell-borderleft-select {
  border-bottom: 1px solid #DEDEDE;
  padding:5px 5px 5px 10px;
}
.datatablecellChild{
  border-bottom: 1px solid #DEDEDE;
  padding:5px 5px 5px 40px;
}
.datatablecell-fill { background: #f3f3f3; }
.datatablecell-borderleft, .datatablecell-borderleft-select, .datatablehead-borderleft, .datatablesubhead-borderleft, .actioninlinebutton, .actioneditlink, .actiondeletelink, .actioneditlinkover, .actiondeletelinkover {
  border-left: 1px solid #DEDEDE;
  border-right: 1px solid #DEDEDE;
}
.actionadd, .actionedit, .actiondelete { margin: 10px 0;}
.datatableheadaddbutton .actionadd { margin: 0;}
.actioneditlink, .actiondeletelink, .actioneditlinkover, .actiondeletelinkover, .actioninlinebutton, .actionaddlabel {
  border-bottom: 1px solid #DEDEDE;
}
.datatablecell-borderleft-select {
  background: #FFFFCC;
}
.datatablecell-select {
  background: #FFFFCC url('images/arrow.gif') no-repeat left;
}
.datatable p{margin:1rem 0;}
.datatable{border: 1px solid #CCCCCC;}

#dataform {
  margin-bottom: 0.5rem;
}
/* START Ajax Search */
.form-autocomplete {
    width: 100%;
    line-height: 28px;
    height: 28px;
}
.input-wrapper {
    width: 100%;
    position: relative;
}
.ajaxResults-container {
    position: absolute;
    width: 100%;
    max-height: 200px;
    top: 29px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #f7f7f7;
    color: #000;
    border-bottom: #e9e9e9;
    z-index: 21;
    text-align: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.1);
}
#appdata ul.ajaxResults {
    margin: 0;
    padding: 0;
}
#appdata ul.ajaxResults li {
    list-style-type: none;
    margin: 0;
    padding: 0.25rem;
    border-bottom: 1px solid #e6e6e6;
}
#appdata ul.ajaxResults li:hover {
  cursor: pointer;
}
/* END Ajax Search */


/* content styles */

.cartbox, .cartbox-checkout {
	width: 100%;
}


/* LW 05/05/2020 - Removed cart font size */


.cartbox-checkout img {
	display:none;
}


.cartbox-top, .quotebox-top{ font-size:16px; font-weight:bold; border-bottom:1px dotted #CCC; }
.cartbox-cell {	border-bottom:1px dotted #CCC; }

.checkout-action { text-align:right; }

/* LW 28/06/2018 - added hover style for checkout action for consitency*/
.checkout-action a:hover{
  color:#FFF;
}
.checkout-action a:visited, .checkout-action a:active, .checkout-action a:focus{
	color:#FFF;
}
.form-submit:hover{
	color:#FFF;
}
.form-submit:visited{
	color:#FFF;
}


.form-submit{ border:none; cursor:pointer; font-family:inherit; }

/*.new-customer, .existing-customer {display: inline;
width: 250px;
float: left;
padding: 23px;
  -webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.new-customer {
	margin:0px 25px 0px 0px;
}*/
/*.boxheader {font-size:14px; padding-bottom:5px; margin-bottom:20px;  border-bottom:1px solid #2E3A3F;}

.boxcontent p {float:left;}

.boxcontent #emailadd {margin-left: 30px;}
.boxcontent #password {margin-left: 9px;}
.boxcontent .small-text {margin-left: 9px;}

.boxcontent .checkout-action, .marginTop20px {margin-top:20px;}
.boxcontent {
	padding:10px;
}*/

/* TAB STYLES */
.templatetablink {
	text-align:center;
	cursor:pointer;
	display:table-cell;
	text-decoration:none !important;
	zoom:1;
}
.templatetab1, .templatetab2, .templatetab3{
	background:#EEEEEE;
	color:#333;
}
.templatetab1active, .templatetab2active, .templatetab3active{
	background:#18509D;
	color:#FFF;
}
.templatetab1, .templatetab1active {
	margin:0px 3px;
	padding:1px 0px 0px 0px;
}
.templatetab2, .templatetab2active {
	margin:0px 2px;
	padding:1px 0px 0px 0px;
}
.templatetab3, .templatetab3active {
	padding:5px 20px;
	margin:0px 1px 0px 1px;
}
td.paging-right{ text-align:right }
td.paging-left{ text-align:left }

/*matrix*/

#p-matrix-options-container,#p-matrix-container, .p-matrix-container-title {margin:0 20px 20px;}
.p-matrix-options-container, .p-matrix-options { width: 100%;}
.p-matrix td, .p-matrix th{ border: 1px solid #fff; padding: 6px 10px; line-height: 18px;  box-sizing: border-box; color:#FFF }
.p-matrix-attributegroup, .p-matrix-attributes { line-height: 40px; padding: 16px 0 0; float:left; }
.p-matrix-attributes.tot-mat{line-height:1;}
/* FW 04-06-2019: clear added back in to stop stacking for long attribue group names. Override this in the child theme if required...it shouldnt be though */
.p-matrix-attributegroup { width: 40%;clear:both;}
.p-matrix-attributes { width: 55%; }
.p-matrix-attribute {margin-right: 0;display: inline-block; text-align:center;}
.p-matrix-attribute.image-attribute {display: inline-block;}
.lookupUnits-container .p-matrix-attribute { margin-right: 1em; display: inline-block; }
.p-matrix { width: 100%;border-collapse: collapse; }


.p-matrix-quantityheading, .p-matrix-format { color:#FFF; text-align: center; font-weight:normal; }
.p-matrix-quantityheading {background-color: #f5f5f5;border: none;}
.p-matrix-quantity { background-color: #333; color: #FFF; text-align: center; font-weight: bold; font-size: 14px; }
.p-matrix-price {
transition: background-color .25s ease-in-out;
-moz-transition: background-color .25s ease-in-out;
-webkit-transition: background-color .25s ease-in-out;
}
.p-matrix-price-link img{
	text-align: center;
	margin: 0 auto;
}
.p-matrix-price { text-align: center; }
.p-matrix-price a {opacity:1;}
.p-matrix-price a {
transition: color .1s ease-in-out;
-moz-transition: color .1s ease-in-out;
-webkit-transition: color .1s ease-in-out;}
.p-matrix-price a { width: 100%; display: block; text-decoration:none; }
.p-matrix-group { color: #FFF; background: #485a60; height: 35px; }
.p-matrix-group h2 { font-size: 16px; color: #FFF; margin: 3px 8px; }
.p-matrix-options {margin: 0;}
td.p-matrix-quantityheading{
  background-color: #808285;
}
td.p-matrix-footer{
  display: none;
}

#p-matrix-container .table-container{
  overflow-x: auto;
}

.p-matrix-price:hover, .p-matrix-price-active { color:white;}
#content .p-matrix-price:hover a:link,
#content .p-matrix-price:hover a:visited,
#content .p-matrix-price-active a:link,
#content .p-matrix-price-active a:visited {
	color:white;
}
/* calculator matrix  */
.w-clearfix.p-matrix-attributes.styles {
  display: block;
  width: 100%;
  padding-top: 0;
}
div#hidenProductDescription {
    display: none;
}
.summary_attribute, .summary_attribute_title {
  width: 49%;
  display: inline-block;
  vertical-align: top;
  font-size: 0.9rem;
}
.summary_attribute_title{
  font-weight: bold;
}
.w-clearfix.summary_row {
  padding: 0.5rem 0;
  text-align: left;
}
.summary_attributes {
    padding: 0rem 1rem;
}
/*.w-clearfix.order_summary_bottom .cta {
  width: 80%;
  margin-left: 10% ;
  margin-right: 10% ;
  margin-bottom: 1.5rem;
}
a.cta.central_cta.quote_cta.email_cta {
  display: none;
}*/

.summary_container a#lightboxTest,
a.cta.central_cta.p-matrix-proceed,
.order_summary_bottom a.readmore{
  margin-bottom: 0;
  width: 49%;
  text-align: center;
  color: #FFF;
  text-decoration: none;
}

.order_summary_title {
  padding: 1rem;
  font-size: 1.6rem;
}
.sk-spinner-rotating-plane.sk-spinner {
  width: 30px;
  height: 30px;
  background-color: white;
  margin: 0 auto;
  -webkit-animation: sk-rotatePlane 1.2s infinite ease-in-out;
          animation: sk-rotatePlane 1.2s infinite ease-in-out; }
@-webkit-keyframes sk-rotatePlane {
  0% {
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
            transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
  50% {
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
            transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }
  100% {
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }
@keyframes sk-rotatePlane {
  0% {
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
            transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
  50% {
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
            transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }
  100% {
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }
/*------Rotating in animation for banners etc--------*/
@-webkit-keyframes rotatein {
    0% {
    -webkit-transform: perspective(1000px) rotateY(-90deg) ;
    }
    100% {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    }
}
@keyframes rotatein {
    0% {
    transform: perspective(1000px) rotateY(-90deg);
    }
    100% {
    transform: perspective(1000px) rotateY(0deg);
    }
}

/*------Updating the quote animation--------*/
/*Left Pane*/
/*Uses animation from header*/
/*Right Pane*/
.left {
    -webkit-transform: perspective(1000px) rotateY(-89deg) ;
    transform: perspective(1000px) rotateY(-89deg);
    -webkit-transform-origin: 0px;
    transform-origin: 0px;
    opacity: 0;
    z-index: 100;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}
.left.visible {
    -webkit-transform: perspective(1000px) rotateY(0deg);
    transform: perspective(1000px) rotateY(0deg);
    opacity: 1;
    transition: 1s;
    -webkit-transition: 1s;
}
/*Right Pane*/
.main {
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
    transform: perspective(1000px) rotateY(0deg);
    -webkit-transform: perspective(1000px) rotateY(0deg) ;
    opacity: 1;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}
.main.fadeout {
    -webkit-transform: perspective(1000px) rotateY(90deg);
    transform: perspective(1000px) rotateY(90deg);
    transition: 1s;
    opacity: 0;
}

.summary_container {
  position: relative;
  background-color: transparent;
  /*padding-left: 1.3rem;*/
  margin-top: 2.3rem;
}
.sidebar {
  box-sizing: border-box;
  padding: 3em 20px;
  background-color: transparent;
  text-align: center;
}
.sidebar.order_summary.main {
  position: relative;
  display: block;
  overflow-x: visible;
  overflow-y: visible;
  width: auto;
  margin-top: 0em;
}
.sidebar.order_summary.left {
    position: absolute;
    display: inline-block;
    margin-top: 0em;
}
.sk-spinner.sk-spinner-rotating-plane {
  display: block;
  width: 30px;
  height: 30px;
  margin-right: auto;
  margin-left: auto;
  background-color: white;
}
.loading_text {
  margin-top: 10px;
  text-align: center;
}
.sidebar.order_summary {
  width: 100%;
  margin-top: 4.25em;
  padding-top: 0em;
  padding-bottom: 0em;
  padding-left: 0;
  padding-right: 0;
  border-radius: 5px;
  background-color: white;
  border: 1px solid #ccc;

}
.sidebar.order_summary.main {
  position: relative;
  display: block;
  overflow-x: visible;
  overflow-y: visible;
  width: auto;
  margin-top: 0em;
}
.order_summart_price {
  text-align: center;
  font-size: 2rem;
  margin: 1rem 0;
  line-height: 2rem;
}
/*template matrix*/

.p-matrix-price-view { background-color: #f7f7f7; text-align: center; height: 28px;}
.p-matrix-attributes.checkout-action { text-align:left; }
.template-matrix-options .p-matrix-proceed { margin-left:0; }

/*checkout*/
#checkout{min-height:500px; margin-bottom: 2rem;}
#checkout p { margin: 10px;}

/* Tooltip */
.tooltip {
    background: url('../images/i.png') no-repeat 0 0;
    width: 21px;
    height: 21px;
    margin-left: 10px;
    vertical-align: text-bottom;
    display: inline-block;
    color:transparent;
}
.tooltip-content {
    display: none;
}

.tooltip.favourite-error{
	background:none;
}

/* Matrix Success Box */

.p-matrix-success {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
background-color: rgba(0, 0, 0, 0.6);
border-radius: 3px;
padding: 20px;
}
.p-matrix-success h3 {
	color: white;
	font-size: 1.3em;
}
.p-matrix-success p {
	padding: 0px;
	text-align: right;
	color: white;
}
.p-matrix-success a:link,
.p-matrix-success a:visited {
	color: white;
	text-decoration:underline;
}
.p-matrix-sucesss-close {
	position: absolute;
	right: -8px; top:-8px;
	background:url('../images/delete.png') no-repeat 0 0;
	width:25px;
	height:25px; 
	opacity: 1;
}

/* Display Only */

.template-box-sets #enquiryform{
	margin: 1rem 2rem;
	margin-bottom:2rem;
}

#enquiryform input[type="submit"]{
	border:none;
	color:#FFF;
	font-size:1rem;
	padding:10px 30px;
}

.template-box-sets #enquiryform input[type="submit"]{
	color:#FFF;
	padding:10px 20px;
	font-size:1rem;
	border:none;
	margin:0;
}

/*-- Template Steps --*/
section.process_section {
  position: relative;
  padding: 1rem 0;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 768px) {
  section.process_section {
      text-align: center; } }

.order_step {
  position: relative;
  display: none; }
  @media only screen and (min-width: 768px) {
    .order_step {
      opacity: 0.6;
      display: block;
      min-height: 60px; } }

.order_step.active {
  opacity: 1;
  display: block; }

.order_step i {
  display: none; }
  @media only screen and (min-width: 768px) {
    .order_step i {
      position: absolute;
      left: 0;
      display: inline-block;
      vertical-align: top;
      font-size: 1.5rem;
      background-color: white;
      width: 60px;
      height: 60px;
      line-height: 60px;
      border-radius: 50%;
      text-align: center; } }

.order_step.active i {
  background-color: #FF8700;
}

.orderspan {
  position: relative;
  display: block; }
  @media only screen and (min-width: 768px) {
    .orderspan {
      padding-left: 70px; } }

.order_step_title {
  font-size: 1rem;
  color: #7B7B7B;
  display: block;
  font-weight: 600; }
  @media only screen and (min-width: 768px) {
    .order_step_title {
      color: #7B7B7B; } }

.order_step.active .order_step_title {
  color: white; }
  @media only screen and (min-width: 768px) {
    .order_step.active .order_step_title {
      color: #009FE3; } }

.order_step_description {
  font-weight: 400;
  display: block;
  line-height: 1.5;
  font-size: 0.875rem;
  color: white; }

.mobilestep {
  display: inline-block;
  margin-right: 5px;
  background-color: white;
  height: 1.25rem;
  width: 1.25rem;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  text-align: center;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1.25rem;
  vertical-align: middle;
 }
  @media only screen and (min-width: 768px) {
    .mobilestep {
      display: none; } }

.title_span {
  display: inline-block;
  vertical-align: middle;
  color: white; }
  
  /* Template Steps */
	@media only screen and (max-width: 768px) {
		.process_section .w-container{
			max-width:none;
		}
		.order_step i{
			font-size: 1.5rem;
			width: 40px;
			    height: 40px;
			    line-height: 40px;
		}
		.orderspan{
			padding-left:50px;
		}
	}
/*-- Template Steps End --*/

/*-- Catalogue USP --*/
#catalogue-usp{
  padding:1rem 0;
}
a.cat-usp,
a.cat-usp:hover{
  color:#FFF;
  display: flex;
  text-decoration: none;
  min-height: 60px;
  justify-content: space-around;
  align-items: center;
  grid-gap: 20px;
}

.cat-usp > span{
  padding-left: 70px;
  display: block;
}


a.cat-usp i{
  display: inline-block;
  vertical-align: top;
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 50%;
  text-align: center;
  background-color: #FFF;
  font-style: normal;
  font-weight: bold;
  font-size: 2rem;
}

.cat-usp-title{
  color: white;
  font-weight: bold;
  font-size:1.1rem;
}
.cat-usp-description{
  color:#FFF;
}
.cat-usp_title,
.cat-usp_description{
	display:block;
}

.usp-flex{
display:flex;
justify-content:space-between;
align-items:center;
}

.usp-container{
	position:relative;
}

@media only screen and (max-width: 768px) {
  a.cat-usp{
    margin-bottom: 1rem;
  }
}


@media screen and (max-width: 480px) {
  .usp-flex{
    flex-direction: column;
    align-items:flex-start;
  }

}

/*-- Catalogue USP End --*/

.chatAdminStyle{
  width:60%;
  padding:20px;
  margin:20px;
  background-color:#eeeeee;
  float:right;
  position:relative;
  margin-right:80px;
}
.chatAdminStyle:before {
  content: "A";
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  position:absolute;
  background-color:#eeeeee;
  height:40px;
  width:40px;
  border-radius:40px;
  line-height:35px;
  text-align: center;
  font-size:26px;
  right: -60px;
  top: 25px;
}
.chatAdminStyle:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  right: -30px;
  top: 30px;
  border: 15px solid;
  border-color: transparent transparent transparent #eeeeee;
}
.chatAdminStyle a:visited, .chatAdminStyle a:active{
  color:#6b6b6b;
}
.chatAdminStyle a:hover{
  text-decoration: underline;
}
.chatAdminStyle a:before {
  content: "\f019";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  margin-right:10px;
}
.chatCustomerStyle{
  width:60%;
  padding:20px;
  margin:20px;
  background-color:#99c105;
  color:white;
  float:left;
  position:relative;
  margin-left:80px;
}
.chatCustomerStyle:before {
  content: "C";
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  position:absolute;
  color:black;
  background-color:#99c105;
  height:40px;
  width:40px;
  color:white;
  border-radius:50%;
  line-height:39px;
  text-align: center;
  font-size:24px;
  left: -60px;
  top: 25px;
}
.chatCustomerStyle:after {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -30px;
    top: 30px;
    border: 15px solid;
    border-color: transparent #99c105 transparent transparent;
}
.chatCustomerStyle a{
  color:#F0FFFF;
}
.chatCustomerStyle a:before {
  content: "\f019";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  margin-right:10px;
}
.chatDate{
  font-size : 24px;
  margin-bottom:20px;
}
.chatDate span{
  font-size : 11px;
}
.chatNote{
  margin-bottom:20px;
}
.chatFile{
  margin-bottom:5px;
}
.buttonLink{
  display: inline-block;
  padding-right: 15px;
  padding-left: 15px;
  background-color: #EEE;
  color: #2D2D2D;
  font-size: 1em;
  line-height: 2.25em;
  text-decoration: none;
}
.buttonLink:hover{
  background: #00a0d2;
  color: #FFF;
  text-decoration:none;
}
.importantButtonLink{
  display: inline-block;
  border-color: #0073aa;
  padding-right: 15px;
  padding-left: 15px;
  background-color: #00a0d2;
  color: #FFFFFF;
  font-size: 1em;
  line-height: 2.25em;
  text-decoration: none;
}
.importantButtonLink:hover{
  background: #0091cd;
    color: #FFFFFF;
    text-decoration:none;
}
#submitProofVersion{
  margin:20px;
}
input#redirect_btn {
    background-color: transparent;
    border: 0;
    display: inline-block;
    padding: 0;
    text-decoration: underline;
    color: #2e3a3f; /* FW 08-10-2018: adding this because the text on this button is white */
}
.checkout-payment-message {
    text-align: center;
    margin-top: 1rem;
}


/* LW 12/07/2018 - added print stylesheet
Print Stylesheet */

@media print{
  #cart-head,
  footer,
  .customer-logo,
  .cookie-law-info-again,
  .mobile_toggle
  {
    display: none;
  }
}

/* LW 23/10/2018 - Image Attribute Styling*/

.p-matrix-attribute .image-radio{
  display: inline-block;
  text-align: center;
  font-size: 0.9rem;
  border:1px solid rgba(0,0,0,0);
  transition: 0.2s;
  cursor: pointer;
}

.p-matrix-attribute .image-radio img{
	margin:0 auto;
}
.p-matrix-attribute .image-radio{
	padding:10px;
	 margin: 0px 5px;
}
.p-matrix-attribute.selected .image-radio{
    background-color: #FFF;
    border: none;
    border-radius: 3px;
    border: 1px solid #ddd;
}

.p-matrix-attribute .image-radio input{
  display: none;
}

.attr-I-container .p-matrix-attributegroup,
.attr-I-container .p-matrix-attributes{
}
.attr-I-container .p-matrix-attributes{
	text-align: center;
}

/* Quote */
.quote-form-bottom input[type=submit]{
    padding: 10px 20px;
    font-size: 1rem;
    color: #FFF;
    border: none;
    margin-top: 1rem;
}
.quote_label{
  padding: 0.5rem 0;
  display: block;
}

.quote_form .form-quantity{
  margin-bottom:1rem;
}
.quote_form .form-quantity input[type="number"]{
  display:inline-block;
  width: 200px;
}


/* PRINT STYLESHEET */
@media print {
  header,footer,
  .scheduler,
  div.p-thumbs,
  .summary_container{
    display: none;
  }
  .banner_section{background-color: #e3e3e3!important; padding:1rem 0;}
  h1.banner_title{color:#000;}
}

/* Designs Catalogue Tab*/
#myTab #tab-2 h2, #myTab #tab-2 .checkout-action{
  display: inline-block;
  margin:0;
}
 #myTab #tab-2 .checkout-action{
  float: right;
 }

 /* Vertical Menu*/

 .whitesection .vertical{
  background-color: #f7f7f7;
}
.greysection .vertical{
  background-color: #FFF;
}

.nav-cat.vertical{
  margin-top:20px;
}

h2.cat-menu-header{
  font-size: 1.2rem;
  color:#FFF;
  padding:5px 10px;
  margin:0;
}

.vertical .ul-nav-prod{
  margin:0;
  padding:0;
}
ul.ul-nav-prod li a{
  color:#000;
}

/* Image Gallery */

.image-nav .slick-slide img{
  padding: 0.5rem 0;
}

.product-slider, image-nav{
    display: none;
}

.image-nav .slick-slide{
	cursor:pointer;
}

.product-slider.slick-initialized, .image-nav.slick-initialized{
    display: block;
}

/* Form styles - KEEP AT END */
.formlabel{
  width:50%;
  padding:3px;
}
.formfield {
  width:50%;
  padding:5px;
}
/* FW 05-09-19: the styling of error fields is being overwritten by child theme styles so this needed updating */
form#createform input.fielderror, form input.fielderror, .fielderror{
	border: 1px solid #CC0000;
}

.box-info, .box-success, .box-warning, .box-error, .box-validation {
border: 1px solid;
margin: 1rem 0;
padding:1rem 0.75rem;
background-repeat: no-repeat;
background-position: 10px center;
}

.box-info ul, .box-success ul, .box-warning ul, .box-error ul, .box-validation ul {
margin-top: 0.5rem;
padding-left: 1rem;
line-height: 1.1rem;
}
.box-info, .box-info p {
color: #00529B;
background-color: #E3F4FC;
}
.box-success, .box-success p {
color: #4F8A10;
background-color: #F1FAE4;
}
.box-warning, .box-warning p {
color: #9F6000;
background-color: #FFF8DF;
}
.box-error, .box-error p {
color: #D8000C;
background-color: #FFE2E2;
}
.box-error p, .box-info p, .box-success p{
margin:0;
}

#loginform {
  margin:0px;
}
.last{ margin-right:0; }
.hide { display:none; }

.form-quantity{
	width:33%;
	display: inline-block;
	padding-right: 5px;
}
.form-quantity input,
.form-quantity span{
	display: inline-block;
}

.form-quantity span{
	width: 7%;
}

.form-quantity input{
	width:90%;
}

@media screen and (max-width: 1080px) {
	.form-quantity{
		width:100%;
		margin-bottom: 1rem;
	}
}
.p-matrix-attribute input[type="checkbox"],
.p-matrix-attribute input[type="radio"]{
	vertical-align:middle;
}

@media screen and (max-width: 480px) {
	.p-matrix-attributes,
	.p-matrix-attributegroup{
		width:100%;
	}
}

.p-matrix-cost,
.p-matrix-total,
.p-matrix-vat{
	display:inline-block;
}

.w-col-4.stickycol{
	width:33%;
}

.format-img span{
	width:33%;
}

.p-matrix-price-link:focus,
.p-matrix-price-link:active{
	color:#FFF;
}

.turnaround-container{
	position:relative;
	overflow:hidden;
}

button.turnaround.disabled{
	cursor:not-allowed;
	background-color:#bebebe;
	color:#FFF;
}

.matrix-change tbody::before {
    background: #fff;
    position: absolute;
    top: 0;
    width: 100%;
    content: url(/wp-content/themes/OPSv3/images/Spinner.gif);
    text-align: center;
    color: #fff;
    height: 100%;
    opacity: 75%;
    display: table-cell;
    vertical-align: baseline;
}

.matrix-qty-buttons{
	text-align:right;
	margin-top: 1rem;
}

button.turnaround{
	border:none;
	font-size:1rem;
	color:#FFF;
	margin-left: 10px;
}