/*
Theme Name: OceanWP Child
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme example child theme.
Author: Hadrien BONNEAU
Author URI: https://hdhadrien.com
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

/*
Theme Name: OceanWP Child
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme example child theme.
Author: Hadrien BONNEAU
Author URI: https://hdhadrien.com
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

/*******************
!!!!! INITIALISATION
*******************/
/*h1 normal page*/
h1.wp-block-heading {
	margin-top: 100px;
}
#main #content-wrap {
	padding-bottom:0px;
}
/*espace au dessus du footer
.page footer,
.category footer {
	margin-top:50px;
}
*/
/*******************
Couleurs
*******************/
:root {
  --blanc: #fff;
	--rose: #fc5c96;
	--rose-f:#ff34a0;
	--violet:#974a7f;
	--bleu-c:#6a85f4;
	--noir-b:#0d0b21;
}
.truc {
  background-color: var(--blanc);
}


/*******************
Typographies (transfonter.org)
*******************/
@font-face {
    font-family: 'Brixton';
    src: url('fonts/Brixton/BrixtonMedium.eot');
    src: url('fonts/Brixton/BrixtonMedium.eot?#iefix') format('embedded-opentype'),
        url('fonts/Brixton/BrixtonMedium.woff2') format('woff2'),
        url('fonts/Brixton/BrixtonMedium.woff') format('woff'),
        url('fonts/Brixton/BrixtonMedium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

h1, h2 {
	color:var(--bleu-c) !important;
}
p {
	color:white;
}
i {
	color:var(--rose)
}
ul li div {
  color: #a2b5eb;
}
/*******************
Marges et Padding
*******************/
.m10 {
	margin:10px;
}
.p10 {
	padding:10px;
}

.ancre {
	padding-top:25px;
}
/*******************
Boutons
*******************/
.elementor-button,
button {
	background:var(--rose) !important;
}

/*******************
Animations
*******************/
#logo-wrap {
  transition: all 0.3s ease; /* Ajustez la durée et le type d'effet selon vos préférences */
}
#header-logo {
    height: 100%; /* Par défaut, la hauteur est de 0 */
    overflow: hidden; /* Cache le contenu lorsqu'il est réduit */
    transition: height 1s ease; /* Ajoute une transition pour la hauteur */
}

#header-logo.visible {
    height: 100%; /* Hauteur complète lorsque la classe 'visible' est ajoutée */
}
#header-logo {
  transition: height 0.3s ease; /* Ajustez la durée et le type d'effet selon vos préférences */
}
/****** js */


/*******************
[[[[[[[[[[[[[ HEADER
*******************/
#header-logo {
	background-color: var(--noir-b);
}
#site-header-inner {
  min-width: 100%;
  margin: 0px;
}
/****** Sub header */
/****** LOGO */
/****** nav */
#nav .elementor-widget-wrap {
  padding: 0px;
}
#menu-menu-entete {
  display: flex;
  justify-content: space-around;
  margin: 0px;
}
#menu-menu-entete li {
  list-style: none;
  height: 65px;
  width: 100%;
}
#menu-menu-entete li a {
	display: flex;
  	justify-content: center;
  	align-items: center;
  	width:100%;
	height:100%;
	text-align:center;
	color:white;
}
/****** Menu Burger */
#menu-toggle {
  width: 10vw;
  height: 10vw;
  border-radius: 6px;
  font-size: 5vw;
}
#burger div {
  display: flex;
  justify-content: center;
}
#menu-toggle {
	display:none;
}
#mobile-dropdown {
  display: none;
}
#mobile-dropdown.active {
  display: block !important;
}

/*******************
[[[[[[[[[[[[[ FOOTER
*******************/
#footer-widgets {
  background-color: var(--violet);
}

/*************************
### Classes documentés ###
*************************/
/****** construction des pages */


/*********************************************
**********************************************
 --->   PAGES
*******************/

/*******************
 ---> Acceuil
*******************/

/*SECTION ---> Cards*/
.card {
  background: #974a7f;
  border-radius: 10px;
  margin: 18px;
  border: 4px solid #ff34a0;
}

/*SECTION ---> Accordéon*/
.elementor-tab-title {
  background-color: var(--violet);
}

#accordeon ul {
  list-style-type: none;
  padding: 0;
  margin: 10px auto;
}
#accordeon li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 5px;
	flex-wrap:wrap;
}
.service1 {
  display: flex;
  width: 75%;
	flex-wrap:wrap;
}
/* Colonne 1 */
.service1 .column:nth-child(1) {
	width: 100px;
	min-width:100px;
}
/* Colonne 2 */
.service1 .column:nth-child(2) {
  align-items: flex-start;
	justify-content: center;
  text-align: center;
	margin-left:15px;
	width:auto;
}
.service2 {
  display: flex;
  width: 25%;
	flex-wrap:wrap;
}
/* Colonne 3 */
.service2 .column:nth-child(1) {
	width: 50%;
	min-width:100px;
}
/* Colonne 4 */
.service2 .column:nth-child(2) {
  align-items: flex-end;
	justify-content:center;
  text-align: center;
	width:50%;
}

#accordeon .column {
  display: flex;
  flex-direction: column;
  max-width: 70%;
  text-align: left;
}

#accordeon .column img {
  width: 100px;
  height: 100px;
  border-radius: 5px;
}

#accordeon .price,
#accordeon .time {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 5px 0;
}

#accordeon .euro-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #f0f0f0; /* Couleur de fond */
  color: #007BFF; /* Couleur de l'icône */
  font-size: 1.2em;
}

#accordeon button {
  padding: 10px 20px;
  background-color: #007BFF;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

#accordeon button:hover {
  background-color: #0056b3;
}

/*SECTION ---> Réseration*/
.step {
  background-color: var(--bleu-c) !important;
}
.latepoint-book-form-wrapper {
  width: 100%;
  background: var(--rose);
  margin-top: 10px;
  padding: 10px;
}
.latepoint-summary-w {
  display: block !important;
  transform: none !important;
}

/*SECTION ---> Formulaire*/
input, textarea, select {
	background-color:var(--blanc) !important; 
}

/*******************
 ---> Page ACTUALITES / le titre a placer sur la page cathégorie / description
*******************/
.clr.tax-desc h1 {
	margin-top: 100px;
	text-align: center;
	color: #395c56 !important;
}
.blog-entry-inner.clr {
	background: #003054;
	padding: 25px;
	border-radius: 5px;
}
.blog-entry-title.entry-title a {
	color: #cad400;
}
.meta.obem-default.clr, .meta.obem-default.clr a {
	color: #35badd !important;
}
.blog-entry-summary.clr p {
	color: #ececec;
}
.blog-entry-readmore.clr a {
	background: #d0d801;
	color: #003054;
	border: 0px !important;
	font-family: Arimo;
	font-size: 0.9em !important;
	font-weight: bold;
}
.blog-entry-readmore.clr a:hover {
	background: #35b9db;
	color: #003054 !important;
}
/****** ACTU single post */


/******************************
PLUGINS :::::::
**************/
/****** formulaire */
.required-marker {
  color: red;
  font-weight: bold;
  margin-left: 4px;
}
#envoyer-mail {
	display: flex;
	align-items: center;
	flex-direction: column;
}
.wpcf7-spinner {
	position: absolute;
	right: 0px;
}
#your-message {
	height:18px;
}
#envoyer-mail input {
  	width:310px;
  	border-radius: 5px;
  	margin-top: 10px;
	color: var(--violet);
}

/****** cookies */

/****** slider */

/****** newsletter */


/*********************************************
**********************************************
RESPONSIVE
*******************/
/*******************
ECRAN
*******************/
@media screen and (max-width: 1024px) {
	/*footer*/
	#Rsfooter {
		max-width:249px;
		margin:auto;
	}
	/*cookies*/
	footer {
	  margin-bottom: 18px;
	}
	#cookie-law-info-again {
		width: 100% !important;
		margin: auto;
	}
	/*scroll-top bouton*/
	.scroll-top-right {
		bottom: 45px !important;	
	}
}

/*******************
TABLETTE
*******************/
@media screen and (max-width: 913px) {
	/*services*/
	#accordeon li {
	  flex-wrap: wrap;
	}
	/* Colonne 3 */
	.service2 .column:nth-child(1) {
		width: 50%;
	}
	/* Colonne 4 */
	.service2 .column:nth-child(2) {
		width:auto;
	}
}

/*******************
MOBILE
*******************/
@media (max-width: 767px) {
	/*header*/
	#nav {
		display:none;
	}
	/*burger*/
	#menu-toggle {
		display:block;
	}
	#menu-toggle i{
		color:var(--blanc) !important;
	}
	#main #content-wrap {
		padding-top:0px;
	}
	/*Services*/
	.service1,
	.service2 {
	  	width: 100%;
		flex-wrap:nowrap;
	}	
	.service2 .column:nth-child(2) {
    	width: 50%;
  	}
}

/*******************
MOBILE 2
*******************/
@media (max-width: 550px) {

}