/*
 Theme Name:    UNITE Child for bethefrontpage.com
 Theme URI:     http://srmsystems.com/themesbethefrontpage/unite-child/v2
 Description:   The bethefrontpage design as a childe responsive based on Colorlib's UNITE theme.
 Author:         
 Author URI:    http://srmsystems.com/
 Template:      unite
 Version:       2.0.0
 Tags:         	light, purple, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  	unite-child
*/

/* import parent theme styling  - BEST PRACTICE is to use wp_enqueue scripts in functions.php
@import url("../unite/style.css");
*/
/* Theme customization starts here
------------------------------------------------------- */

/* ======== Typographic styling ======================================================*/

/* base typography styles */
@font-face {
	font-family: 'copyfonts_com_gotham_light';
	src: url('./fonts/copyfonts_com_gotham_light.eot') format('embedded-opentype'),  
	     url('./fonts/copyfonts_com_gotham_light.woff2') format('woff2'),  
		 url('./fonts/copyfonts_com_gotham_light.woff') format('woff'),  
		 url('./fonts/copyfonts_com_gotham_light.ttf') format('truetype'),  
		 url('./fonts/copyfonts_com_gotham_light.svg#copyfonts_com_gotham_light') format('svg');
}
body, .woocommerce {font-family: copyfonts_com_gotham_light, Arial, Helvetica, sans-serif;
	font-size:15px;line-height:1.42857;letter-spacing:-0.04em;color:#2f2f2f;}

/* Home page specific styles */
.caption.home {text-transform: uppercase;text-align: center;font-size: calc(8px + 0.5vw);  }

/* Checkout page specific styles */
.woocommerce form .form-row .input-checkbox { position: relative;}

/* ======== Brand styling ======================================================*/
/* link brand styles  */
a,.link,a:focus,a:hover {color: #9e5893;}  /* #9e5893; */

/* === Button brand styles */
.btfp {color:#9e5893;}
.btfp-grey {color: #2f2f2f;}
.btfp-green {  color:#8dca0a ;  }
.btn-btfp, .btn-btfp a,
.btn-primary, .label-primary , 
.panel-btfp .panel-heading{background-color: #af1c97;border-color: #9e5893;color: #fff;}
.btn-btfp.btfp-green, .btn-btfp.btfp-green a {background-color: #8dca0a;border-color: #8dca0a;color: #fff;}

/* Carousel brand styles */
.entry-title {color: #9e5893; }
.carousel-caption h4 {background-color:transparent !important; color:#9e5893; /* #2f2f2f; */
	text-shadow: none;}

/* Footer brand styles */
.site-footer {border-top: #af1c97 solid 1px !important;border-bottom: #e9e5e2 solid 3px;}
#colophon {background: #f7f6f4;}
.site-info .copyright,.site-info a { color:#9e5893;}

/* Headlines brand styles */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {color:#9e5893;}			/* Default headlines font colour is the brand colour */

/* inside the product summary box the headlines colour is the default font colour */
/* Move to plugin */

.product-summary h4,.product-summary .h4,.product-summary h5,
.product-summary .h5,.product-summary h6,.product-summary .h6 {color:#2f2f2f;}	

/* Navigation bar brand styles */
.navbar.navbar-default  {background-color: #fff9e5; border-top: 1px solid #efeeec; border-bottom: 1px solid #efeeec; }
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {color: #af1c97;background-color: #fff9e5;}

/* Page brand styles */
#page {border-top: 3px solid #af1c97;width: 100%;;margin-bottom: 3px;}

/* You can change the cart icon by CSS by below code in CSS, */
.shopping-bag-button:before,.navbar-nav .fa-shopping-cart, .navbar-nav .btfp-shopping-cart{
    content: '';
    background: url('./img/shopping-bag.jpg') ;
    width: 30px;
    height: 30px;
	left:-17px;
	position:absolute;
	top:2px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
}
/* i.fa.fa-shopping-cart {display:none;} */
/* ======= Layout Styling ======================================================*/

/* Carousel layout styles */

.carousel-inner > .item > img {height: auto;width: 100%;}
.carousel-inner .item {	padding:35px 0 0;} 			/* add some space move the caption above image */
.carousel-caption {padding-top: 0px;position: absolute !important;top: 0% !important;left: 0% !important;right:5%;height:100%;width:95%;}
.carousel-caption p, 
.carousel-caption h4 {background-color:transparent; }
.carousel-caption h4 {	letter-spacing: -0.02em;text-align: left;max-width:100%;z-index: 10;}/* line-height: 1.2em; */
.carousel-caption h4 {display: block !important;position: absolute !important;top: -3% !important;left: -1% !important;}
.carousel-caption a {bottom:3%;right: .03%;position:absolute;z-index: 99;width: 28%;height:7%;font-size: 1.4em;font-size:2.0vw;}

/* composer layout styles - Move to plugin only*/
/* .composer ul li a {background: #f7f7f5 none repeat scroll 0 0;color: #666666;display: block;font-size: 14px;margin-right: 4px;padding: 10px 7px 2px;}
.composer-submenu li {font-size: 13px;display: inline-block; padding-right: 7px;} */

/* Header brand styles */
.site-branding {margin-bottom: 0.4rem; margin-top: 1.0rem;}

/* Footer brand styles */
.site-footer {margin-bottom: 40px;min-height: 150px;}
.site-info .copyright,.site-info a {text-align: center;}

/* Navigation layout styles */
.navbar {margin-bottom:12px;min-height:40px;}		/* set nav bar minimum height and space below */
.navbar.navbar-default  {padding:5px 13px;	margin-bottom:7px;}	/* move nav separation bars off top and bottom and ends */
.navbar-nav > li > a {padding-top:8px; padding-bottom:8px;} /* set height of nav selects  */

/* ======= WooCommerce Styling ======================================================*/

/* woocommerce brand styling */
.woocommerce .woocommerce-info::before {color: #9e5893; }
.woocommerce .woocommerce-info {border-top-color: #9e5893;}
.woocommerce #respond input#submit, .woocommerce a.button, 
.woocommerce button.button, .woocommerce input.button { background-color: #af1c97;color: #ffffff;}

/* woocommerce layout styling */

/* position preview image in product frames */
.preview-container { overflow:hidden;position:absolute;z-index:-2;}
.preview-container img {position:relative;}
.preview-page-tab, .preview-page-tab a , .page-tab.preview, .page-tab.preview a {background:#eff6f4 none repeat scroll 0 0 !important;}

.product_cat-front-page.preview-container {top:14%;left:25.1%;width:50.2%;} 
.product_cat-front-page.preview-container > img { top:-0.7%;left:-100%;max-width:200%;width:200% !important;}

.product_cat-double-page.preview-container {top:25.1%;left:13.6%;width:72.9%;}
.product_cat-double-page.preview-container > img {top:3%;left:1%;max-width:100%;width:98% !important;}
 
.product-thumbnail .product_cat-front-page.preview-container  {top:3%;left:10.1%;width:49.0%;}
.product-thumbnail .product_cat-double-page.preview-container  {top:11.1%;left:8.6%;width:56.0%;}

/* ======= Media Query Styling ======================================================*/

  /* Media query stuff */
@media (max-width: 416px) {
.hidden-xxs {display:none ! important;}
}
@media (min-width: 416px) {
.carousel-caption   {display:block !important;} /* force carousel buttons to remain until tablet:portrait size */
}
@media (min-width: 516px) {
	.carousel-caption h4 {font-size:14px;}
}
@media (max-width:767px) {
	.carousel-caption {display:block;}
	/*.carousel-caption h4 {display:none !important;} */
	.carousel-caption a {font-size:2.1vw; right: -0.97%;width: 33%; padding-left:5px;}
}
@media (min-width: 768px) {
	.carousel-caption h4 {font-size:18px;}
}
@media (min-width: 992px) {
	.carousel-caption h4 {font-size:24px;}
	#social {top: 3px;	}					/* Override Unite styling for small header  col-xs-6 */
}
@media (max-width: 992px) {
	.header-small #social {top: 3px;float: right; text-align: center;}	/* Override Unite styling for small header */
}
@media (min-width: 1200px) {
	.carousel-caption h4 {font-size:24px;}
	.carousel-caption  a {font-size:1.5vw;}
}