/*
 Theme Name:   Pêche Roussanne
 Theme URI:    https://www.peche-roussanne.fr/
 Description:  Pêche Roussanne de Monein
 Author:       Onokaa SAS
 Author URI:   https://www.onokaa.com
 Template:     onk-shop
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/

@font-face {
    font-family: 'Florent';
	src: url('./assets/fonts/Florent-Bold.otf');
    src: url('./assets/fonts/Florent-Bold.otf?#iefix') format('embedded-opentype'),
		url('./assets/fonts/florent-bold-webfont.woff2') format('woff2'),
		url('./assets/fonts/florent-bold-webfont.woff') format('woff');
    
	font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Parisienne';
	src: url('./assets/fonts/Parisienne-Regular.otf');
    src: url('./assets/fonts/Parisienne-Regular.otf?#iefix') format('embedded-opentype'),
		url("./assets/fonts/Parisienne-Regular.ttf") format("truetype"),
		url('./assets/fonts/parisienne-regular-webfont.woff2') format('woff2'),
		url('./assets/fonts/parisienne-regular-webfont.woff') format('woff');
    
	font-weight: normal;
    font-style: italic;
}
:root{
	--roussanne-font: #3D3D3D;
	--roussanne-orange: #EC6842;
	--roussanne-orange-light: #F4EFEA;
	--roussanne-green: #055445;
	--roussanne-dark-green: #044236;
	--roussanne-white: #ffffff;
	--roussanne-black: #000000;
}
.has-font-color-background-color {background-color: var(--roussanne-font) !important;}
.has-font-color-color {color: var(--roussanne-font) !important;}
.has-orange-background-color {background-color: var(--roussanne-orange) !important;}
.has-orange-color {color: var(--roussanne-orange) !important;}
.has-orange-light-background-color {background-color: var(--roussanne-orange-light) !important;}
.has-orange-light-color {color: var(--roussanne-orange-light) !important;}
.has-green-background-color {background-color: var(--roussanne-green) !important;}
.has-green-color {color: var(--roussanne-green) !important;}
.has-dark-green-background-color {background-color: var(--roussanne-dark-green) !important;}
.has-dark-green-color {color: var(--roussanne-dark-green) !important;}
.has-white-background-color {background-color: var(--roussanne-white) !important;}
.has-white-color {color: var(--roussanne-white) !important;}
.has-black-background-color {background-color: var(--roussanne-black) !important;}
.has-black-color {color: var(--roussanne-black) !important;}


html, body{font-family: 'Open Sans', sans-serif; background: url('./assets/images/body-bg.jpg'); color: var(--roussanne-font);}
p, .p-like, ul, ol, dl, blockquote, pre, td, th, label, textarea, caption, details, figure{line-height: 1.6;}
a{color: var(--roussanne-orange);}
.btn, button, input.submit, .frm_button_submit, .wp-block-button__link{font-weight: 600; border-radius: 5px; color: var(--roussanne-white); background-color: var(--roussanne-orange); font-size: 1.6rem; text-transform: none; font-family: 'Open Sans', sans-serif;}

h1, .h1-like{font-size: 3.2rem; text-transform: uppercase; font-weight: 700; margin-bottom: 0; font-family: 'Florent';}
h2, .h2-like{font-size: 2.2rem; color: var(--roussanne-orange); text-transform: uppercase; font-weight: 700; margin-bottom: 0; font-family: 'Florent';}
h2.bg-monein{position: relative; margin-bottom: 25px;}
h2.bg-monein:before{position: absolute; content:''; background-image: url('./assets/images/monein.png'); background-repeat: no-repeat; background-size: contain; background-position: center center; display: block; top: -15px; width: 100%; height: 150%; left: 0;}
h3, .h3-like{font-size: 1.8rem; font-family: 'Open Sans', sans-serif; font-weight: 600;}

@media(min-width: 782px){
	.btn, button, input.submit, .frm_button_submit, .wp-block-button__link{font-size: 1.8rem;}
	
	h1, .h1-like{font-size: 5rem;}	
	h2, .h2-like{font-size: 3.2rem;}
	h2.bg-monein{ margin-bottom: 50px;}
	h2.bg-monein:before{top: -15px; height: 200%;}
	h3{font-size: 2rem; }
}

i[class^="icon-"]:before{display: inline-block; vertical-align: middle; width: 20px; margin-right: 10px; }
.icon-mail:before{content: url('./assets/images/icon-mail.svg');}
.icon-phone:before{content: url('./assets/images/icon-phone.svg');}
.icon-map-white:before{content: url('./assets/images/icon-map-white.svg');}
.icon-mail-white:before{content: url('./assets/images/icon-mail-white.svg');}
.icon-phone-white:before{content: url('./assets/images/icon-phone-white.svg');}
.icon-arrow--left:before{content: url('./assets/images/angle-left.svg');}
.icon-arrow--right:before{content: url('./assets/images/angle-right.svg'); }

address{font-style: normal;}

.wp-block-group.alignfull > .wp-block-group__inner-container,
.wp-block-cover.alignfull > .wp-block-cover__inner-container {width: 100%; margin-right: auto; margin-left: auto; padding-right: 15px; padding-left: 15px;}
@media (min-width: 600px){
	.wp-block-group.alignfull > .wp-block-group__inner-container,
	.wp-block-cover.alignfull > .wp-block-cover__inner-container{max-width: 540px;}
}
@media (min-width: 782px){
	.wp-block-group.alignfull > .wp-block-group__inner-container,
	.wp-block-cover.alignfull > .wp-block-cover__inner-container{max-width: 768px;}
}
@media (min-width: 992px){
	.wp-block-group.alignfull > .wp-block-group__inner-container,
	.wp-block-cover.alignfull > .wp-block-cover__inner-container{max-width: 960px;}
}
@media (min-width: 1280px){
	.wp-block-group.alignfull > .wp-block-group__inner-container,
	.wp-block-cover.alignfull > .wp-block-cover__inner-container{max-width: 1140px;}
}

.wp-block-quote > cite{margin-top:40px}

/**
*	Top bar
**/
#top-bar{font-size: 1.4rem; color: #878986; border: 0; padding: 10px 0; background: var(--roussanne-white); position: relative;}
#top-bar .grid{align-items: center; display: flex !important; flex-wrap: wrap}
#top-bar .grid > *{flex-basis: 50%;}
#top-bar .widget_media_image{text-align: center !important; flex-basis: 100%; margin-top: 10px;}
#top-bar .widget_media_image img{height: 60px !important; width: auto;}
#top-bar a{text-decoration: none; color: inherit; font-weight: 600;}

@media (min-width: 782px){
	#top-bar{font-size: 1.8rem;}
	#top-bar .grid{flex-wrap: nowrap}
	#top-bar .grid > *{flex-basis: auto;}
	#top-bar .grid > *:first-child{order: 1;}
	#top-bar .grid > *:nth-child(2){order: 3;}
	#top-bar .widget_media_image{order: 2; flex-basis: auto; margin: 0;}
	#top-bar .widget_media_image img{height: auto !important;}
}



/**
*	Navbar
**/
header{background: var(--roussanne-green); position: relative; height: auto; padding: 5px 0;}
header.sticky{height: auto;}
header:before{content: url('./assets/images/header-bg.svg'); position: absolute; vertical-align: top; left: 0; top: -12px; width: 100%; display: block;}
header.sticky:before{display: none;}
header #navbar nav{text-transform: none; font-weight: 600; top: 40px; right: 0; background: var(--roussanne-orange-light);}
header #navbar nav a{color: #424A3E;}
header #navbar nav li.active > a {color: var(--roussanne-green);}
header #navbar nav ul > li:last-child{border-bottom: 0}

header #navbar .nav-toggle{background: transparent; padding: 10px 15px;}
header #navbar .nav-toggle > span{background: var(--roussanne-white);}

@media (min-width: 782px){
	header{padding: 30px 0 25px 0; background: var(--roussanne-orange-light);}
	header:before{top: -5px;}
	header #navbar nav {display: inline-block; width: 100%; text-align: center;}
	header #navbar nav ul > li {padding: 0 30px;}
}


/**
*	Header
**/
#header {
    height: 450px;
    min-height: 450px;
}
#header .header-content h1,
#header .header-content .h1-like,
#header > article .header-content h1, 
#header > article .header-content .h1-like{
	font-size: 3.2rem;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0;
	font-family: 'Florent';
	text-align: center;
	color: var(--roussanne-white);
}
#header > article .header-overlay,
#header.with-slide article .header-overlay{position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(38,89,77,0.2);
    z-index: 1;
}


#header .header-content h1 + h2,
#header .header-content .h1-like + h2{font-family: 'Parisienne'; text-transform: none; font-weight: normal; color: var(--roussanne-white); font-size: 3rem; margin-top: 0;}

#header.with-slide{height: 50vh; min-height: 350px; position: relative;}
#header.with-slide .header-content{display: table; text-align: center; height: 100%; width: 100%;}
#header.with-slide .header-content > .content-area{display: table-cell; vertical-align: middle; width: 100%; height: 100%;}
#header.with-slide .slick-slider{height: 100%}
#header.with-slide .slick-slider .slick-track, 
#header.with-slide .slick-slider .slick-list{height: 100%}
#header.with-slide article{background-size: cover; background-repeat: no-repeat; background-position: center center;}
#header.with-slide .header-content{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#header.with-slide .slick-prev,
#header.with-slide .slick-next{
	border-radius: 0;
	-webkit-transform: none;
    -ms-transform: none;
    transform: none;width: 100px; height: 60px; z-index: 999; font-size: 1rem; letter-spacing: 1px; font-family: 'Open Sans', sans-serif; text-transform: uppercase; bottom: 0; top: auto;}
#header.with-slide .slick-prev:before,
#header.with-slide .slick-next:before{display: none;}
#header.with-slide .slick-prev{right: 100px; left: auto; color: #055446; background: var(--roussanne-white); border-top-left-radius: 5px;}
#header.with-slide .slick-next{right: 0; background: var(--roussanne-green); color: var(--roussanne-white); border-top-right-radius: 5px;}
#header.with-slide .slick-prev i:before{width: 5px;}
#header.with-slide .slick-next i:before{width: 5px; margin-left: 10px; margin-right: 0;}

#header > article{background-image:url(./assets/images/header-bg-2.jpg);}

@media(min-width: 782px){
	#header .header-content h1,
	#header .header-content .h1-like,
	#header > article .header-content h1, 
	#header > article .header-content .h1-like{font-size: 5rem;}	
	#header .header-content h1 + h2,
	#header .header-content .h1-like + h2{font-size: 6rem;}
	
	#header.with-slide{height: 75vh;}
	#header.with-slide .slick-prev,
	#header.with-slide .slick-next{
		width: 175px; height: 90px; letter-spacing: 2px;font-size: 1.2rem;
	}
	#header.with-slide .slick-prev{right: 175px; }
	#header.with-slide .slick-prev i:before,
	#header.with-slide .slick-next i:before{width: 6px;}
}

/**
*	Global
**/
.col-photos{margin-bottom: 50px; position: relative;}
.col-photos:before{content:''; border-radius: 50%; z-index: 1; position: absolute; left: -125px; top: 25px; width: 250px; height: 250px; background: var(--roussanne-orange-light);}
.col-photos > *{z-index: 2; position: relative;}
.col-photos figure{margin: 0;}
.col-photos figure img{border-radius: 5px; max-height: 350px;}
.col-photos figure:first-child{width: 80%;}
.col-photos figure:nth-child(2){width: 70%; margin-top: -20%; margin-left: auto; margin-right: 0;}

@media(min-width: 782px){
	.col-photos{margin-bottom: 0;}
	.col-photos figure img{max-height: 100%;}
}

@media(min-width: 992px){
	.col-photos:before{left: -200px; top: 50px; width: 400px; height: 400px;}
}


/**
*	Homepage
**/
.home #primary{padding-top: 0; padding-bottom: 0;}
.home .ou-trouver{margin-top: 50px !important; padding-top: 0; padding-bottom: 150px; overflow: visible; 
background-position: center top;
background-image: url('./assets/images/vue-verger.png'); background-size: cover;}
.home .ou-trouver .wp-block-columns{text-align: center; margin-bottom: 0;}
.home .ou-trouver .wp-block-column{
	-webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	border-radius: 10px;
	margin: 0 2.5%; padding: 35px 25px; flex-basis: 45%; 
	background: var(--roussanne-orange-light); color: var(--roussanne-font);
	height: -moz-fit-content;
	  height: -webkit-fit-content;
	  height: -fit-content;
	  margin-bottom: 25px;
}
.home .ou-trouver .wp-block-column figure{margin: 20px auto;}

.home .news-container{margin-top: 25px;}

.wp-block-latest-posts__list a{text-decoration:none;color:var(--roussanne-font);font-size:2rem;font-weight:600;}
.wp-block-latest-posts__featured-image{margin-bottom:20px;}

@media(min-width: 782px){
	.home .ou-trouver{margin-top: 150px !important; padding-bottom: 250px;}
	.home .ou-trouver .wp-block-column{margin-bottom: 0;}
	.home .ou-trouver .wp-block-column:last-child{margin-top: -50px;}
	
	.home .news-container{margin-top: 0;}
}


.entry-content .onk-page-intro{height:0;line-height:unset;}
.entry-content .onk-page-intro + #read-more{font-weight:700;color:var(--roussanne-orange);margin-top:30px;}

/**
*	Produits
**/
#roussanne-products{margin-top: 50px;}
.product-item{
	background: var(--roussanne-white); 
	/*padding: 35px 35px 0;*/
	-webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.25);
	margin-bottom: 25px;
	display: flex;
}
.product-item a{text-decoration: none; color: inherit;}

.product-item .product-content{flex-basis: 60%; flex-grow: 0; padding: 20px; order: 2;}
.product-item .product-content .product-title{font-size: 2rem; font-family: 'Open Sans', sans-serif; font-weight: 600;}

.product-item .product-thumbnail{flex-basis: 40%; flex-grow: 0; order: 1; position: relative; margin-top: 0; /*width: calc(100% + 70px); margin-left: -35px; margin-right: -35px; height: 450px; margin-top: 50px;*/}
/*.product-item .product-thumbnail:before{left: 25px; top: -25px; padding: 15px; content: url('./assets/images/arrow.svg'); position: absolute; display: block; width: 20px; height: 20px; background: var(--roussanne-orange); border-radius: 50%;}*/
.product-item .product-thumbnail > img{width: 100%; height: 100%; object-fit: cover; -o-object-fit: cover;}

@media(min-width: 782px){
	.product-item{height: -moz-fit-content;
    height: -webkit-fit-content;
    height: -fit-content;}
	.product-item .product-content{padding: 35px;}
}

.description-cat{text-align:center;}

/**
*	Articles
**/

#article-grid > article{
	margin-bottom:15px;
}
.post-item {
    margin-bottom: 50px;
}

.post-item > a {
    display: flex;
    text-decoration: none;
    align-items: stretch;
    flex-direction: column;
    color: inherit;
}
.post-item > a .post-thumbnail {
    flex-basis: 60%;
    flex-grow: 0;
    margin-top: 0;
	margin-bottom: 15px;
}
.post-item > a .post-thumbnail > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -o-object-fit: cover;
}
.post-item > a .post-container {
    flex-basis: 70%;
    flex-grow: 1;
    height: 100%;
}
.post-item>a .post-container .post-title {
    margin-bottom: 10px;
    display: block;
}
.post-item>a .post-container .read-more {
    color: var(--roussanne-orange);
    margin-top: 10px;
    display: block;
    font-weight: 600;
}

@media (min-width: 782px){
	.post-item > a {flex-direction: row; height: 100%;}
	.post-item > a .post-thumbnail {margin-right: 25px; margin-bottom: 0;}
}


/**
*	Single
**/
#next-prev-links{margin-bottom: 50px;}
.roussanne-product-content{display: flex; flex-wrap: nowrap;}
.roussanne-product-content h1{font-size: 4rem; margin-bottom: 0px; }
.roussanne-product-content ul.breadcrumb{margin-top: 0px; padding: 0; background: none;}
.roussanne-product-content .product-thumbnail{flex-basis: 30%; margin-right: 25px;}
.roussanne-product-content .entry-content{flex-basis: 70%;}

/**
*	Formulaires
**/
.with_frm_style input[type=text], .with_frm_style input[type=password], .with_frm_style input[type=email], .with_frm_style input[type=number], .with_frm_style input[type=url], .with_frm_style input[type=tel], .with_frm_style input[type=file], .with_frm_style input[type=search], .with_frm_style select, .with_frm_style .frm-card-element.StripeElement
{
height:40px}
.frm_style_style-formidable.with_frm_style .frm_compact .frm_dropzone.dz-clickable .dz-message, .frm_style_style-formidable.with_frm_style input[type=submit], .frm_style_style-formidable.with_frm_style .frm_submit input[type=button], .frm_style_style-formidable.with_frm_style .frm_submit button, .frm_form_submit_style, .frm_style_style-formidable.with_frm_style .frm-edit-page-btn,
.frm_style_style-formidable.with_frm_style .frm-edit-page-btn:hover, .frm_style_style-formidable.with_frm_style input[type=submit]:hover, .frm_style_style-formidable.with_frm_style .frm_submit input[type=button]:hover, .frm_style_style-formidable.with_frm_style .frm_submit button:hover{
	background:var(--roussanne-orange);
	border-color:var(--roussanne-orange);
	font-family: 'Open Sans', sans-serif;
	color:var(--roussanne-white);
	font-weight:600;
	padding:1rem 4rem;
}

/**
*	Footer
**/
footer{background: var(--roussanne-green); margin-top: 0; color: var(--roussanne-white);}

footer .roussane-logo{margin-bottom: 50px;}
footer .grid .widget_text{text-align: center; margin-bottom: 25px}
footer .grid .widget_text a{color: inherit; text-decoration: none;}
footer i[class^="icon-"]:before{display: block; width: 30px; margin: 0 auto 5px;}

footer #footer-menu{background: var(--roussanne-dark-green); padding: 10px 0}
footer #footer-menu .copyright nav{display: inline-block; width: auto;}
footer #footer-menu ul > li:after{content: '-';}
footer #footer-menu .onokaa{margin-top: 10px; display: block;}
footer #footer-menu .onokaa img{width: 75px;}

@media(max-width: 781px){
	footer #footer-menu .grid > *{text-align: center;}
}
@media(min-width: 782px){
	footer .grid .widget_text{margin-bottom: 0;}
	footer i[class^="icon-"]:before{display: block; width: 30px; margin: 0 auto 20px;}
	footer #footer-menu .onokaa{margin-top: 0;}
}


#roussanne-message{position: relative; top: 0; width: 100%; left: 0; background: var(--roussanne-orange); color: var(--roussanne-white); padding: 5px 0; z-index: 9999; text-align: center; font-weight: bold;}
#roussanne-message .textwidget {display: flex; align-items: center; justify-content: center;}
#roussanne-message picture{display: inline-block; margin-right: 15px;}
#roussanne-message p{display: inline-block; margin: 0;}
#roussanne-message #close-message{position: absolute; top: 0px; cursor: pointer; right: 0px;}
#roussanne-message #close-message > span{-webkit-transform: rotate(45deg) translate3d(0,0,0); transform: rotate(45deg) translate3d(0,0,0); display: inline-block}