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

          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
*/

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

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


/* ================ OPS CATALOGUE ===============*/

.listing-category-image img, .listing-product img, .listing-template img { max-width: 99.99%; height:auto; }
.listing-template img { border: 1px solid #ddd; }
.listing-product {margin-bottom: 30px;}
.listing-product-name {color:<?= $secondary_menu_bg ?>; text-decoration:none;}
.listing-product-name, .listing-category-name, #designs .listing-name { font-weight: bold; font-size: 1.1em; 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 {
    min-height: 150px;
}

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

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

#myaccount { padding:0 15px; }
.search-orders{ margin-bottom:20px; }

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

input, select {
border: 1px solid #e3e3e3;
padding: 5px;
color: #2e3a3f;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
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%;
}

.cartbox {
	font-size: 10px;
}
.cartbox-checkout {
	font-size: 14px;
}

.cartbox-checkout img {
	display:none;
}

.cartbox-cell-total, .cartbox-cell, .cartbox-top, .quotebox-cell, .quotebox-top, .quotebox-cell-total{
	padding: 12px 5px;
	vertical-align:top;
}
.cartbox-top, .quotebox-top{ font-size:16px; font-weight:bold; border-bottom:1px dotted #CCC; }
.cartbox-cell {	border-bottom:1px dotted #CCC; }
.cartbox-cell-total, .quotebox-cell-total {
	border-top:1px dotted #CCC;
	color:#2E3A3F;
	font-size:14px;
	font-weight:bold;
}
.checkout-action { text-align:right; }
.checkout-action a, .cart-view, .cart-add, .cart-save, .form-submit,.wpcf7-submit, .btn {
    zoom:1;
    text-align:center;
    display:inline-block;
    padding: 8px 20px;
    margin: 10px 0 0 5px;
    background-color: #691f99;
    color: #FFF;
    font-size:14px;
    font-weight: bold;
    line-height:20px;
    text-decoration:none;
    opacity: 1;
    transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; -webkit-border-radius: 5px;  -moz-border-radius: 5px; border-radius: 5px;
}
.checkout-action a:visited{
	color:#FFF;
}
.form-submit:hover{
	color:#FFF;
}
.form-submit:visited{
	color:#FFF;
}


.form-submit{ border:none; cursor:pointer; font-family:inherit; }
.checkout-action a:hover, a.cart-view:hover, a.cart-add:hover, a.cart-save:hover, .form-submit:hover, .wpcf7-submit:hover, .btn:hover { opacity: 0.8; }

.cart-view, .cart-add, .cart-save {
	text-align:right;
	display:block;
	font-size:11px;
}
.cart-discount .form-submit {
	float:none;
}
.cart-discount{
	float:left;
	border:1px solid #CCC;
	padding:8px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.p-thumbs { font-size: 11px; text-align:right; }
.p-thumbs a, .p-thumbs a:visited { text-decoration: none; color:<?= $secondary_menu_bg ?>; }

.cartsteps{ width:100%; }
.cartsteps-cell, .cartsteps-cell-active {
	padding:3px;
	color:#FFFFFF;
	text-align:center;
	width:20%;
	border-left:1px solid #FFF;
}
.cartsteps-cell {
  background: #efefef;
  color:#2E3A3F;
  padding:5px;
}
.cartsteps-cell-active {
	background: #f58026;
    padding:5px;

}
/*.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; }
.p-matrix-attributegroup, .p-matrix-attributes { line-height: 24px; min-height: 30px; padding: 16px 0 0; float:left; }
.p-matrix-attributegroup { width: 40%;   }
.p-matrix-attributes { width: 55%; }
.p-matrix-attribute { margin-right: 0; display: 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 { background-color: <?= $matrix_quantity_head;?>; color: <?= $matrix_quantity_text;?>; text-align: center; font-weight:normal; }
.p-matrix-quantityheading { background-color: #FDFDFC; }
.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 { background-color: #f7f7f7; 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: 10px 0px 0px; }

.p-matrix-price:hover, .p-matrix-price-active { background-color:#666; color:white;}
.p-matrix-price:hover a:link,.p-matrix-price:hover a:visited, .p-matrix-price-active a:link, .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;
}
.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;
}*/
a.cta.central_cta.quote_cta.last_cta.p-matrix-proceed {
  margin-bottom: 1.5rem;
}
.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;}
#checkout p { margin: 10px;}

/* ================ OPS TEMPLATE SYSTEM MATRIX ===============*/
.template-matrix-more {
  text-align: center;
  margin-bottom: 1em;
}

/* ================ OPS TEMPLATE SYSTEM PREVIEW ALL ===============*/

#template-actions.proceed_box{
  margin: 1rem 0;
  padding: 0.5rem 1rem;
  background-color: #f5f5f5;
}
#template-actions-checkbox {
  text-align: center;
  margin-top:0.5rem;
}
#template-actions-checkbox input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.25); /* IE */
  -moz-transform: scale(1.25); /* FF */
  -webkit-transform: scale(1.25); /* Safari and Chrome */
  -o-transform: scale(1.25); /* Opera */
  transform: scale(1.25);
}

/* ================ OPS TEMPLATE SYSTEM ===============*/
#home h1, #catalogue h1, #designs h1 {margin-bottom: 0.5rem;}
#designs .listing-name { font-size: 1.25rem; }
.listing-template, #template-designs .w-col, #templates .w-col { margin-bottom: 2rem;}
.listing-template-name { font-size: 1.25rem; }
.templates-loading {
    background:#F2F2F2;
    font-size:1rem;
    padding:5px 10px;
    text-align:center;
    width:75%;
    margin:0px auto;
    display:none;
}
.template_thumb {border:1px solid #E0E0E0;}
#p-matrix-options-container { margin:0; }
a.template-create-link:link, a.template-create-link:visited { color: <?= $secondary_menu_bg ?>; font-weight: bold;opacity: 0.8; }
a.template-create-link:hover { opacity: 1; }
div.create-online{
    padding:20px;
}

.tab-pane { padding: 1em 0  }
.tab-pane h2 { margin-bottom: 15px;}
.tab-pane .checkout-action { margin-bottom: 1em;}
.template-form{
	border:1px solid #d9d9d9;
	padding:10px;
}
div.template-form-intro{
	margin:0;
	color:#535555;
	font-size:14px;
	font-weight:bold;
}
.template-form input{
	width:99%;
	border: 1px solid #7b7f80;
	text-align:center;
	color:#9ea1a2;
	height:38px;
	font:bold 16px/38px Arial,Helvetica,sans-serif;
}
.template-proof{ float:none; }

/* Template proof tabs*/

.template-proof.r-tabs{
  background-color: #FFF;
  border:none;
  border-radius: 0;
}

.template-preview-loader{
	position:absolute;
	margin-top:30%;
	left:30%;
	right:30%;
	color:#111;	
	text-align:center;
	border:1px solid #ccc;
	background:#eee;
	display:none;
}
.template-preview-loader img{
	padding:50px;
}
#templatezoom { width:100%; overflow:auto; }
.template-image {
    margin: 0 auto;
    position:relative;
}
.templateimage {
    margin: 0 auto;
    /* FW 04-10-2017: changed to top left because left of the template goes outside of the scrollable area so not usable */
    transform-origin: top left;
    border:1px solid #E0E0E0;
    overflow:hidden;
}
.templatefields {
    position: relative;
    left: 0px;
    top: 0px;
    height: 100%;
}
.templateform{
    padding-left:0;
}
.templateform input[type=text], .templateform textarea { width:95%; }
.templateform textarea { height:150px; }
#template-confirm-box{
  width:600px;
  max-width: 95%;
  margin: 10px auto;
}
.create-online-confirm{ float:left; height: 40px; margin-right:10px; }
.template-continue{
	text-align:center;
}
.fields-margin{
	margin: 10px 0 4px;	
}
.field-image{
	margin: 5px 0 10px;
}
.field-loader {
	zoom:1;
	display: inline-block;
	margin: 10px 0;
}
#editor-notifications{
  position:absolute;
  top:-1rem;
  left:0;
  right:0;
  z-index: 9999;
  margin:0;
}

/*=====================================================
TEMPLATES PAGE
=====================================================*/
.templates_section {  padding-bottom: 2rem;}
.templatesection {  padding-bottom: 2rem;}
.templates_section .other_designs {  display: none; }

@media only screen and (min-width: 992px) {
  .templates_section .other_designs {display: block; }
}

.filter_block {
  position: relative;
  padding: 20px;
  background-color: #f7f7f7;
  margin-bottom: 1rem;
}

@media only screen and (min-width: 992px) {
    .filter_block{      margin-bottom: 0; }
}

@media only screen and (min-width: 768px) {
  .filter_block {     padding-top: 0;    background-color: transparent;  }
  .filter_block h2 {    font-size: 1.5rem;    cursor:auto;  }
  .filter_block h2:after { display: none; }
}

@media only screen and (min-width: 768px) {
    .filter_block .toggle {      display: none; }
    .filter_block .toggle.expanded {      display: none; }
  }

@media only screen and (max-width: 768px) {
  .filter_block h2 {
    padding-bottom: 0;
    font-size: 1.25rem;
    margin: 0;
    cursor: pointer;
  }
  .filter_block .fa{
    float:right;
  }

  .filter_block .toggle {
    cursor: pointer;
    display: block;
    position: absolute;
    right: 0;
    top: 0.5rem;
    line-height: 3rem;
    padding: 1rem 2rem;
    font-size: 1.5rem;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    color: #e43131;
  }
}
.filter_block .toggle.expanded {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

#filters {
  display: none;
  padding-top: 1rem;
}

@media only screen and (min-width: 768px) {
  #filters {
    display: block; }
}

#filters input[type="checkbox"] {
  display: inline-block;
  margin: 0 10px 0 0;
}


/* ================ OPS TEMPLATE DATA UPLOAD AND PREVIEW STYLES ===============*/

h3 {
  font-size: 1.25rem;
}

.design_product_thumb {
  display: block;
}

.tc-filter-Tag {
  margin-bottom: 1rem;
}

.tc-filter-Tag:last-child {
  margin-bottom: 0;
}


.tc-filter-Tag ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.design_product_thumb {
  margin-bottom: 2rem;
}


/*------Template PRoduct Selection -----------*/
.optionbuttons {
  display: table;
  width: 100%;
  margin-top: 1px;
}

.optionbutton {
  display: block;
  vertical-align: middle;
  background: <?= $secondary_menu_bg ?>;
  border-right: 1px solid lightgrey;
  padding: 0.5rem 10px;
  text-align: center;
  color: <?= $button_link_text ?>;
  width:100%;
}

.optionbutton:hover {
  opacity: 0.8;
}

.optionbutton:last-child {
  border-right: none;
}

/*------ Template Uploader -----------*/

h2.subtitle {
  margin-bottom: 1rem;
}

.templatedownload {
  font-size: 0.875rem;
}

.templatedownload:before {
  content: "\f0ce";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
  margin-right: 10px;
  margin-top: 1rem;
}

.lonebutton {
  margin-left: 0;
}

.secondary {
  background-color: #808285;
}

.form_group {
  padding-bottom: 1rem;
}

.form_group:last-child {
  padding-bottom: 0;
}

.form_group label {
  width: 30%;
  float: left;
  font-weight: bold;
}

.form_group input[type="text"], .form_group textarea, .form_group select, span.info {
  width: 70%;
  float: left;
}

span.info {
  padding-left: 10px;
  color: #2e3a3f;
}

.pricepreview {
  padding-bottom: 1rem;
  display: block;
  font-size: 2rem;
}
.pricepreview .currency {
  font-size: 0.5em;
}

.proceed_box {
  margin-top: 2rem;
  padding: 1.5rem 20px;
  background-color: #f5f5f5;
  border: 1px solid transparent;
}
.proceed_box > * {
  margin-bottom: 0.5rem;
}
/*.slick-prev, .slick-next {
  position: absolute;
  top: 100%;
  height: 3rem;
  line-height: 3rem;
  font-size: 0;
  color: transparent;
  width: 40px;
  text-align: center;
  border: none;
  background-color: #333;
  outline: none !important;
}

.slick-prev:before, .slick-next:before {
  color: white;
  font-size: 1rem;
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
}

.slick-prev:before {
  content: "\f0d9";
}

.slick-next:before {
  content: "\f0da";
}

 
.slick-prev {
  left: 0;
  border-right: 1px solid #555;
}

.slick-next {
  right: 0;
  border-left: 1px solid #555;
}
*/
.design_slide {
  cursor: crosshair;
}

.design_slide:hover {
  opacity: 0.8;
}

.designpreview {
  display: block;
  margin-bottom: 1rem;
  height: 3rem;
  line-height: 3rem;
  background-color: #333;
  text-align: center;
  color: white;
}

.designpreview:hover {
  background-color: #555;
}

.disclaimer {
  display: block;
  font-size: 0.75rem;
  line-height: 0.75rem;
  color: #888;
  margin-top: -0.5rem;
}

.preview_title {
  display: block;
  text-align: center;
  padding: 0 20px;
}

.slidernav {
  width: 200px;
  display: block;
  margin: auto;
  text-align: center;
  padding-top: 0.5rem;
}

/* ================ OPS TEMPLATE PROOF / APPROVALS ===============*/

.template-actions{ background:#f5f5f5;padding:3px 5px; margin-bottom:20px;line-height: 40px; text-align:left; }
.template-actions .checkout-action { text-align:left; }
.template-actions a {float:none;margin:0.5em 0; }



/* Tooltip */
.tooltip {
    background: url('img/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;
}

/* Matrix Success Box */

.p-matrix-success {
	position: fixed;
	bottom: 20px;
	right: 20px;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.6);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	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;
}

/* Template Cloud */

.tc-image img {
	max-width:100%;
	height: auto;
	border: 1px solid #ddd;
}
.tc-back .checkout-action {
	text-align: left;
}
.tc-template #p-matrix-container {
	margin-top: 20px;
	clear:both;
}
.p-matrix-cost {
	font-size:16px;
	color: #F7901E;
	font-weight: bold;
}
.tc-design-price {
	display: block;
}
.tc-filters ul {
	margin-left:0;
	padding-left: 0;
}
.tc-filters ul li {
	list-style-type: none;
}
.tc-listing {
	padding: 8px;
}
.tc-loading {
    background:#F2F2F2;
    font-size:20px;
    padding:5px 10px;
    text-align:center;
    width:450px;
    margin:0px auto;
    display:none;
    border-radius: 5px;
}
.listing-tc-image {
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	height:220px;
	width: 200px;
	position: relative;
}
.listing-tc-image img {
	box-shadow: 3px 3px 3px #ccc;
	max-width:193px;
	max-height: 200px;
}
#tc-matched .listing-tc-image img, #tc-similar .listing-tc-image img {
	width: 99.9%;
	height: auto;
}
#tc-matched .listing-tc-image, #tc-similar .listing-tc-image {
	width: 99.9%;
}
.listing-tc-image-1 {
	z-index: 10;
}
.listing-tc-image-1 img {
	margin-left: -10px;
	margin-top: -12px;
}
.listing-tc-image-2 {
	z-index: 5;
}
.listing-tc-image-2 img{
	position: absolute;
	margin-top:1px;
	margin-left: 3px;
}
.listing-tc-image-active {
	z-index: 20;
	position: relative;
}
#post-15 {
	padding: 0 50px;
}

/*-- Template Steps --*/
section.process_section {
  position: relative;
  padding: 1rem 0;
  background-color: #009FE3;
  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 {
  color: white;
  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;
  color: #FF8700; }
  @media only screen and (min-width: 768px) {
    .mobilestep {
      display: none; } }

.title_span {
  display: inline-block;
  vertical-align: middle;
  color: white; }
/*-- Template Steps End --*/

/* Form styles - KEEP AT END */
.formlabel{
  width:50%;
  padding:3px;
}
.formfield {
  width:50%;
  padding:3px;
}
.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;
}
#loginform {
  margin:0px;
}
.last{ margin-right:0; }
.hide { display:none; }