/*
Theme Name: Terres-Celtiques
Description: Theme enfant de StoreFront pour le site de la boutique Terres-celtiques
Author: Jonathan RAVIX
Author URI: https://www.jr-dev.fr
Template: storefront
Version: 0.1.0
*/

html{
	background: #969696;
}

body{
	font-family: 'Montserrat';
	background: #f5f2ed;
}

body > #page > header{
		width: 100%;
    position: fixed !important; 
		border:0 !important;
		height:100px;
}

header, .custom-logo, .site-search, #site-header-cart, .cart-contents > .amount, .cart-contents:after, #content{
  transition: 0.5s;
}

#masthead{background-size: cover;}

#content{
	padding-top:140px;
}

.storefront-primary-navigation .col-full{
	min-width: 100% !important;
	margin: auto 0;
	padding:0;
	background: #f5f2ed;
	text-align:center !important;
	border-bottom: 4px solid #969696;
	position:absolute;
	top:-39px;
}

#site-navigation {
	width: 100%;
}

.site-branding{
	margin: auto !important;
}

.custom-logo{
	min-width: 20% !important;
	position: absolute;
	margin: -7px 0 0 20% !important;
	left: 0 !important;
	right: 0 !important;
	top:50%;
	transform: translate(0, -80%);
}

.storefront-primary-navigation{
	position: absolute;
	width:100%;
	bottom:0;
}

#menu-menu-principal li a{
	font-weight: 600;
	color:#767676;
	padding: 5px 25px;
}

#menu-menu-principal li a:after{
	font-weight:100 !important;
}

#site-header-cart *{
	margin:0;
	padding:0;
}
#site-header-cart{
	width:300px;
	top:65px;
	margin: 0 auto;
	left:55%;
	right:0;
	position:absolute;
}
#site-header-cart .count{
	display:none;
}
.cart-contents > .amount{
	width:auto;
	position:absolute;
	display: block !important;
	color: #F5F2ED;
	text-shadow: 0px 0px 4px #000;
	text-align: center;
	top:-45px;
	left:15%;
}
.widget_shopping_cart_content *{
	padding: 1px 3px 5px  !important;
}
.cart-contents:after{
	content: " " !important;
	width:100% !important;
	height:50px !important;
	display: block !important;
	background: url("/wp-content/themes/terres-celtiques/img/panier.png") no-repeat center;
	background-size: contain;
	position: absolute;
	margin: -60px 0;
}

.site-search{
	position: absolute;
	margin: -35px 50% 150px !important;
	right: -15%;
	left:auto;
	width: 10% !important;
}

.storefront-breadcrumb{
	margin:10px 0;
	padding:0;
}

.woocommerce-LoopProduct-link  img, .woocommerce-LoopProduct-link a, .woocommerce-LoopProduct-link span{
	margin: 0 !important;
	padding:0 !important;
}

.woocommerce-LoopProduct-link h2{
		padding:0;
		margin:0 !important;
		white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.woocommerce-LoopProduct-link .button{
	padding:8px !important;
}

.woocommerce-LoopProduct-link .imagewrapper{
	min-height: 250px;
	min-width:250px;
	position: relative;
}

.woocommerce-LoopProduct-link img{
	position: absolute;
	margin: auto !important;
	top:0;
	bottom:0;
	left:0;
	right:0;
}

.single-product #primary {
    width: 100% !important;
}

.single-product #sidebar-primary {
    display: none !important;
}

.woocommerce-products-header .term-description{
	display:none;
}

.storefront-sorting{
	display:none;
}

.widget .widget-title{
	border:none;
	padding:0;
	margin-bottom:0px;
}

.widget .page_item{
	margin-bottom:3px;
}

footer{
	padding: 20px 0 15px !important;
}

.footer-widgets{
	padding:0;
}

.widget_text{
	position: relative;
}

#custom_html-2 .textwidget{
	position: absolute !important;
	margin-top: 50%;
	top:-70px;
}

.site-info{
	margin:0;
	padding:5px 0 0;
}

.site-info a, .site-info br{
	display:none;
}

.woocommerce-MyAccount-navigation-link--downloads{
	display:none !important;
}

/* Accueil */
.accueil-imgs{
	width:80%;
	text-align:center;
	margin: 10px auto !important;
	padding-top:35px;
}

.accueil-img-1{
	float:left;
	width:30%;
}
.accueil-img-2{
	width:70%;
	float:right;
	margin-right:-3px;
}
.accueil-img-3{
	clear:both;
	float:left;
	width:56%;
	margin-top:0.3%;
}
.accueil-img-4{
	margin-top:0.3%;
	width: 44%;
	float:right;
	margin-right:-1px;
}

.wc-block-grid__products{
	padding-top:20px;
	padding-bottom: 20px;
}
.wc-block-grid__product{
	margin-bottom:10px !important;
}
.wc-block-grid__products  img, .wc-block-grid__products a, .wc-block-grid__products div{
	margin: 0 !important;
	padding:0 !important;
}

.wc-block-grid__products .wc-block-grid__product-title{
		padding:0;
		margin:0 !important;
		white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wc-block-grid__products .wp-block-button{padding:0 !important;}
.wc-block-grid__products .wp-block-button a{
	padding:8px !important;
}

.wc-block-grid__product-image{
	min-height: 250px;
	min-width:250px;
	position: relative;
}

.wc-block-grid__products img{
	position: absolute;
	margin: auto !important;
	top:0;
	bottom:0;
	left:0;
	right:0;
}

/* Style pour l'animation du header */

@media screen and (min-width: 1099px) {
.home header{
	height:470px !important;	
}

.home #content{
	padding-top:480px;
}

.home header .custom-logo{
	min-width: 50% !important;
	margin: -80px auto 0 !important;
}


.home header .site-search{
	left:-140px;
	width: 280px !important;
	right: 0;
	margin-top:150px !important;
}
.home header #site-header-cart{
	top: 390px;
	left:0;
}

.home header .cart-contents > .amount{
	width:100%;
	position:relative;
	top:0;
	left:0;
}

.widget_shopping_cart{
	margin-top:-10px !important;
}


.home header .cart-contents:after{
	margin: -140px auto 0;	height:100px !important;
}
	
}

header.small{
	height:100px !important;	
}

header.small .custom-logo{
	min-width: 20% !important;
	margin: -7px 0 0 20% !important;
	top:50%;
	transform: translate(0, -80%);
}

header.small .site-search{
	left:auto;
	width: 10% !important;
	right: -12%;
	margin-top:-35px !important;
}

header.small #site-header-cart{
	top: 65px;
	left:55%;
}

header.small .cart-contents > .amount{
	width:auto;
	position:absolute;
	top:-45px;
	left:15%;
}

header.small .cart-contents:after{
	margin: -60px 0;
	height:50px !important;
}
/* Mobiles and tablettes devices */

@media screen and (min-width: 767px) and (max-width: 1100px){
	.products li, .wc-block-grid__product{
		max-width:150px;
	}
	.products li img, .wc-block-grid__product img{
		margin:0 auto!important;
		max-width:150px !important;
	}
}

@media screen and (max-width: 767px) {
	/* Navigation */
	header .custom-logo{
		min-width: 60% !important;
		width:auto !important;
		top:50px;
	}
	body > #page > header{
		position: relative !important;
		margin-bottom: -120px;
		height:60px;
		border-bottom: 3px solid #999 !important;
	}
	#primary{
		padding-top: 25px;
	}
	.storefront-primary-navigation .col-full{
		border: 0;
	}
	button.menu-toggle{
		position: fixed;
		bottom: 0px;
		top: auto;
		right:0;
		max-width: 100%;
		width: 33% !important;
		height: 49px;
		border: none;
		font-size: 2.3vh; 
		border-left: 1px solid #ddd;
		z-index:20;
		padding-top:5px;
	}
	.dropdown-toggle{
		width: 100% !important;
		height:100% !important;
		position: absolute;
		right:0;
	}
	.dropdown-toggle:after{
		color: white;
		position: absolute;
		right:15px;
		top: 12.5px;
	}
	#site-navigation .menu{
		display:none;
	}
	
	#site-navigation.toggled .menu{
		top:0;
		display: block;
		position: fixed;
		overflow: auto;
		width:100%;
		height:100%;
		background: #555;
		color: #F5F2ED !important;
		z-index:1;
	}
	.menu a{
		color:#F5F2ED !important;
		text-align: left;
		padding-left:20px !important;
	}
	.menu a:hover{
		color:#969696 !important;
	}
	.site-search{
		padding:0 !important;
	}
	.widget_product_search{
		display:none;
	}
	.site-search.visible{display:block;}
	.site-search.visible .widget{
		display:block !important;
		position: fixed !important;
		width: 67% !important;
		left:0 !important;
		right: auto !important;
		bottom:0 !important;
		height:49px !important;
		z-index: 20;
		background:#fff;
	}
	.visible .search-field{
		height:49px;
	}
	.woocommerce-product-search:before{
		top:50% !important;
		margin-top:-7px;
	}
	
	/* Footer */
	.storefront-handheld-footer-bar {
		z-index: 2;
		height: 50px;
	}
	.footer-cart-contents{
		margin-top: -7px;
		background: none !important;
	}
	.columns-3 .my-account{
		display:none;
	}	
	.columns-3 .search{
		display:none;
	}
	.wc-block-grid__products li{
		max-width: 100% !important;
	}
	footer{
		text-align: center;
		padding-bottom: 100px !important; 
	}
	footer .widget{
		margin-bottom: 25px;
	}
	footer .widget li:before{
		display: none;
	}
	#custom_html-2 .textwidget{
		position: relative !important;
		top: 0 !important;
		margin: 0;
		padding: 0;
	}
	#custom_html-2 .textwidget img{
		margin: 0 auto;
	}
}