/*
Theme Name: Johnson & Boon
Theme URL: https://www.arlexonline.co.uk
Description: Child of Impreza theme
Author: Hayden Kibble
Author URL: https://www.arlexonline.co.uk
Template: Impreza
Version: 1.0.0
Text Domain: Impreza-child
*/




/* Original J&B CSS */

.titled {    
	  text-align: right;
    padding: 10px;
    display: inline-block;
    right: 0px;
    float: right;
    color: white;
    text-transform: uppercase; 
}

#alcohol {
	background-color: #8bb743;
}

#commercial {
	background-color: #4a8ccc;
}

#landlords {
	background-color: #F68D1B;
}

#divorce {
	background-color:#eb7eba;
}

#employment {
	background-color:#ef1010;
}

#family {
	background-color:#FF4C84;
}

#disputes {
	background-color:#01A594;
}

#employeers {
	background-color:#945EDA;
}

#private {
	background-color:#B530C9;
}

/* Register page */
.register-package-desc{
	min-height: 75px;
	margin-bottom: 0;
}

/* Members Area */
#my-referral-code, #my-referral-url{
	padding: 10px 14px;
	background: #f5f5f5;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 5px;
	font-size: 30px;
	text-align: center;
	max-width: 300px;
	margin: auto;
	overflow: hidden;
}
#my-referral-url{
	font-size: 24px;
	white-space: nowrap;
}

.upb_row_bg, .upb_video-bg, .vcpb-fs-jquery {
    overflow: hidden;
}

.vcpb-vz-jquery, .vertical_layer_parallax {
    background-position: 50% 0;
}

.upb_row_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-position: center center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 0;
}

.vcpb-vz-jquery, .vertical_layer_parallax {
    background-position: 50% 0;
}

.vcpb-fix, .vcpb-vz-jquery, .vertical_layer_parallax {
    background-attachment: fixed;
}

#discount-offer-coupon-row .l-section-h{padding: 1rem 0 3rem;}
#discount-offer-coupon-row .discount-offer-coupon {max-width: 400px; margin: auto;}
#discount-offer-coupon-row .aio-icon-description{padding-top: 25px;}
#discount-offer-coupon-row .discount-offer-coupon h1{font-size: 40px; font-family: Arial;}

#discount-tabs .l-section-h{padding: 2rem 0 3rem;}

.square_box-icon .aio-icon-square_box {
    height: 100%;
    width: 100%;
    position: relative;
    display: block;
}

.square_box-icon .aio-icon-square_box .aio-icon, .square_box-icon .aio-icon-square_box .aio-icon-img {
    position: absolute;
    right: 0;
    left: 0;
}
.members-heading{ text-align: center; margin: auto; display: block; float: none;}
.members-heading h1 span{background: #b4964a; padding: 5px 10px;}

.w-grid .post_author{display: none;}

.w-pricing-item .w-pricing-item-features a{text-decoration: underline;}

.w-pricing-item .w-pricing-item-features li{
    text-align: left;
    font-size: 0.9rem;
    line-height: 1.1rem;
    padding: 0.4rem 2rem 0.4rem 3rem;
}
.w-pricing-item .w-pricing-item-features li:before{
  content: "\f00c"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  margin-left: -2em;
  margin-right: 1rem;
}

/*.w-pricing-item-footer a.w-btn{background-color: #000!important; color: #fff!important;}*/

.wpb_text_column table ul li {text-align: left;}

.w-pricing-item .w-pricing-item-features li:last-child{text-align: center !important;}
.w-pricing-item .w-pricing-item-features li:last-child:before{display:none; }

#register-subtext .l-section-h{padding-top: 0;padding-bottom: 0;}

#my-referral-url{position: relative;padding-right: 52px;}
#my-referral-url span{display: block; overflow: hidden;}
.btn-url-copy{
    position: absolute; top: 5px; right: 5px; background: #08277a; color: #fff; font-size: 12px;
    padding: 4px 6px;
    border-radius: 3px;
    transition-duration: 0.1s;
    z-index: 99;
}

.btn-url-copy:active{background: #dd0000;}
#url-copied-message{color: #d00000; font-size: 12px; text-align: center; min-height: 25px;}
#url-copied-message span{display:none;}



.mp-form-row.mepr_tos a{text-decoration: none; border-bottom: 1px #000 dotted; }
.mp-form-row.mepr_tos a:hover{text-decoration: none; border: none;}

.w-message.color_red a{color: #a24141; text-decoration:underline;}

.field-note{color: #555; margin-bottom: 10px; font-size: 12px;}

span.file-name{font-style: italic;}


@media only screen and (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
}


@media only screen and (min-width: 768px) {
    .hide-on-desktop {
        display: none !important;
    }
}