/*
Theme Name: reflexetiquettes
Description: Theme enfant du theme screenr.
Author: Info Conception
Author URI: https://infoconception.fr
Template: screenr
Version: 1.0
*/
:root {
  --main-color: rgb(37,51,112);
}

h3 {font-weight: 500 !important;}

.entry-content h2 {font-size:0.9375rem !important;letter-spacing:inherit !important;line-height: 1.7;color: #777777;font-weight:bold !important;}

a {color: var(--main-color) !important;}

/*************************
NAVIGATION
 ************************/

.nav-menu li.current-menu-item > a,
.nav-menu li.menu-item a:hover{
    color: var(--main-color) !important;
}

.container {
	margin:1.5% auto;
	display: flex !important;
    justify-content: center;
	position:relative;
}

span.tel-desktop {
	display: inline-block;
    position: relative;
    vertical-align: middle;
    background-color: var(--main-color);
    color:#fff;
    padding:0 10px;
}

span.tel-desktop:hover {
    cursor: pointer;
}

span.tel-desktop a,
.nav-menu span.tel-desktop a:hover {
	color:#fff !important;
}

.nav-menu a {font-size:16px !important;}

.nav-menu .icon-home {font-size:22px !important;}

.site-header {
    line-height: 40px !important;
}

.site-branding, .header-right-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
}

.header-right-wrapper {margin-left: 7% !important;}

#nav-toggle {color:transparent !important;}

#nav-toggle span:before, #nav-toggle span:after {background:var(--main-color) !important;}
#nav-toggle span {background:var(--main-color) !important;}
#nav-toggle.nav-is-visible span {background:transparent !important;}
.nav-menu.nav-menu-mobile {height:inherit !important; top:45px !important;border-bottom:inherit !important;}
/* -------------------------------------------------------------- */
/* BLOC ACCUEIL
/* -------------------------------------------------------------- */

.button_shortcode {
	background-color:var(--main-color);
	color:#fff !important;
	padding:1% 2%;
	margin-top:1%;
	display: inline-block;
}

.container-home section {
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
	padding:1%;
}

.container-home section div {
	display: inline-block;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
    width: calc(100% / 2 - 10px);
	padding:1%;
	vertical-align: middle;
}

.blue {
	/*background-color: rgba(145,40,23,0.1);*/
	background-color: rgba(37,51,112,0.1);
}

.container-home section#id_3 a {
	display:inline-block;
	width: calc(100% / 4 - 45px);
	height:25vh;
	margin:1%;
}

.container-home section#id_3 a .vignettes {
	display: block;
    position: relative;
	background-size: cover;
	padding:0;
	width: 100%;
    height: 100%;
}

.container-home section#id_3 a:hover {
	text-decoration:inherit;
}

.container-home section .vignettes::after {
	content: '';
	display:block;
	position:absolute;
	top:0;
	left:0;
	width: 100%;
    height: 100%;
	transition: all ease-in 400ms;
		-ms-transition: all ease-in 400ms;
		-o-transition: all ease-in 400ms;
		-moz-transition: all ease-in 400ms;
		-webkit-transition: all ease-in 400ms;
}

.container-home section .vignettes:hover::after {
	box-shadow: #484848 0px 0px 10px;
	transition: all ease-in 200ms;
		-ms-transition: all ease-in 200ms;
		-o-transition: all ease-in 200ms;
		-moz-transition: all ease-in 200ms;
		-webkit-transition: all ease-in 200ms;
}

.container-home section .vignettes h4 {
	display: block;
    position: relative;
    z-index: 5;
	text-transform: uppercase;
	text-align:center;
	width: 60%;
    padding: 2%;
    margin: 0 auto;
    background-color: rgba(255,255,255,0.8);
	box-shadow: #333 0px 7px 20px;
		-ms-box-shadow: #333 0px 7px 20px;
		-o-box-shadow: #333 0px 7px 20px;
		-webkit-box-shadow: #333 0px 7px 20px;
		-moz-box-shadow: #333 0px 7px 20px;
}

section h3 {
    text-transform: uppercase;
    color: var(--main-color);
    font-weight: bold !important;
    margin: 2% 0;
}

.container-home section#id_3 h3 {
	font-size:2.2em;
}

.container-home section#id_4 {padding:2% 0;}

[class^="icon-"]{font-size:4em;}
.icon-home {font-size:1em !important;}

.icon-trolley, .icon-graphic-design, .icon-hours,
.quantity p, .pao p, .advice p {
	display:inline-block;
	vertical-align:middle;
}

.quantity p, .pao p, .advice p {margin-left:1%;width:auto;margin-bottom:0;}

.quantity, .pao, .advice {width:calc(100% / 3 - 3px) !important;text-align:center;}


/* -------------------------------------------------------------- */
/* SLIDER
/* -------------------------------------------------------------- */

#bloc-slider {
	display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
}

#content_slider {
	display: block;
    position: absolute;
    z-index: 10;
    text-align: center;
    width: 100%;
}

#content_slider h1 {text-transform: uppercase;}

#content_slider h1, 
#content_slider h2 {
	color:#fff;
	font-weight: bold;
}

/* -------------------------------------------------------------- */
/* RUBRIQUE ETIQUETTE / ETIQUETAGE
/* -------------------------------------------------------------- */

#page-header-cover.swiper-slider.no-image .swiper-slide .overlay {
    background-color: #253370 !important;
}

#page-header-cover .swiper-slide-heading {margin-bottom: 0;}

.swiper-intro-inner {
	padding-top: 5% !important;
    padding-bottom: 5% !important;
	text-align:left;
}

.item:first-child{
	margin-top:0;
}

.item {
	display:block;
	position:relative;
	width:100%;
	height:auto;
	margin:3% 0;
}

.item .thumbnail {
	display:inline-block;
	position:relative;
	vertical-align:center;
	width:calc(100% / 3);
}

.item .thumbnail img {width:100%;}

.item .content {
	display:inline-block;
	position:relative;
	vertical-align:middle;
	width:calc(100% / 1.6);
	margin-left:2%;
}

/* -------------------------------------------------------------- */
/* CONTENT PAGE
/* -------------------------------------------------------------- */

.page-template-default .entry-content {
	max-width:inherit;
}

.page-template-default img {
	margin-bottom:2%;
}

.entry-footer {display:none;}

.post .entry-content p {
	text-align:justify !important;
}

/* -------------------------------------------------------------- */
/* ACTUALITES
/* -------------------------------------------------------------- */

.item-actu {
	display: inline-block;
    position: relative;
    vertical-align: top;
    width: calc(100% / 3 - 23px);
	margin:10px;
	background-color: rgba(0,0,0,0.04);
	height:470px;
}

.item-actu .thumbnail-actu img {width:100%;}

.item-actu .thumbnail-actu {
	margin-bottom:2%;
	display: block;
    position: relative;
    width: 100%;
    height:200px;
    overflow: hidden;
}

.item-actu .content-actu {padding:3%;}

.item-actu .content-actu h2 {font-size:1.5em;}

.item-actu a {
	bottom: 0;
    position: absolute;
    margin-bottom: 4%;
}

.rpwwt-post-excerpt {font-size:12px;}

/* -------------------------------------------------------------- */
/* CONTACT
/* -------------------------------------------------------------- */

.wpcf7-form-control-wrap {
    position: relative;
    display: inline-block;
    width: calc(100% / 3 - 4px);
    margin: 5px 0;
}

.email, .message,
.email input, .message textarea {
	width:100%;
}

input[type="submit"], input[type="submit"] {
	background-color:var(--main-color) !important;
}

.prenom {margin-right:5px;margin-left:5px;}

/* -------------------------------------------------------------- */
/* FOOTER
/* -------------------------------------------------------------- */

footer .row {
	width:70%;
}

footer a {color:#fff !important;}

@media (max-width:767px){
	.site, .site-main {overflow:hidden;}
	.container-home section div {width:100%;}
	.container-home section {padding: 5% 1%;}
	#content_slider h1, #content_slider h2 {font-size:1.2em;}
	.site-branding { width:50px;}
	.container-home section#id_3 a{width:100%; margin: 3% 0.5%;}
	.flexslider, .flexslider ul li  {height:150px;}
	.flexslider ul li img {height:150px !important;width:auto !important;min-width:100% !important;}
	.item .thumbnail, .item .content {width:100%;}
	.item .thumbnail {margin-bottom: 2%;}
	.header-right-wrapper {display: block;position: relative;width:92%;}
	.container-home section#id_3 a {width:100% !important;}
	.container-home section#id_4 {padding: 5% 0;}
	.item-actu {width:100%; margin: 0 0 10px 0;height: 420px;}
	#primary {padding:0 5px !important;}
	.container {padding-right:0 !important;padding-left:0 !important;}
	span.byline {width:100% !important;padding-left:0 !important;}
	.single .entry-header .entry-title {margin-bottom:0;}
	#primary, #secondary {width:100% !important;display:inline-block;}
	.container {display:block !important;}
	#secondary {margin:0 5px;}
	.site-footer .footer-widgets.section-padding {padding:4% 2% !important;}
	footer .row {width: 100%;}
	.sidebar .widget {margin-bottom: 20px;text-align: center;}
	.wpcf7-form-control-wrap, .wpcf7-form-control-wrap input {width: 100% !important;}
	.prenom {margin:0 !important;}
	.rpwwt-widget ul li {text-align:left;}
}

@media (max-width:715px) {
	.quantity, .pao, .advice {width:80% !important; text-align:left !important;margin:0 auto;display:block !important;}
}

@media (min-width:550px) and (max-width:767px){
	.container-home section#id_3 a {width:calc(100% / 2 - 8px);}
}

@media (min-width:768px) and (max-width:1024px){
	.metaslider .slides img {width:100% !important;}
	.flexslider, .flexslider ul li, .flexslider ul li img  {height:200px !important;}
	.item-actu {width: calc(100% / 2 - 22px);height: 450px;}
	#nav-toggle {width:100% !important;}
	.nav-menu.nav-menu-mobile {top:80px !important;}
	.container-home section#id_3 a {display: inline-block;width: calc(100% / 2 - 21px) !important;height: 17vh;}
	.container-home section .vignettes h4 {font-size:1rem;}
	.container {display:block !important;}
	footer .row {width: 100%;}
}

@media (max-width:1199px) {
	.container-home section#id_3 a {display: inline-block;width: calc(100% / 4 - 22px);}
}

@media (min-width:1200px) and (max-width:1440px){
	.container-home section#id_3 a {display: inline-block;width: calc(100% / 4 - 32px);}
}

@media (min-width:2050px) {
	/*.container-home section#id_3 a {display: inline-block;width: calc(100% / 3 - 44px);}*/
}

	
	