diff --git a/src/components/Formation_Partner_Catalog.js b/src/components/Formation_Partner_Catalog.js index 7a39078..c6be14e 100644 --- a/src/components/Formation_Partner_Catalog.js +++ b/src/components/Formation_Partner_Catalog.js @@ -1,5 +1,5 @@ import React, { useState, useEffect } from "react"; -import ReactPlayer from 'react-player' + import { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from "react-share"; import { SocialIcon } from 'react-social-icons'; import { Button, } from "reactstrap"; @@ -7,19 +7,16 @@ import { useHistory } from "react-router-dom"; import { Helmet } from "react-helmet"; import { useCookies } from "react-cookie"; import { confirmAlert } from 'react-confirm-alert'; -import topimg from "../mysy_img/top.png"; + import coeurimg from "../mysy_img/coeur.png"; import img_met_program from "../mysy_img/met_programmation.jpg"; -import img_met_hotel from "../mysy_img/met_hotel.jpg"; + import img_met_graphisme from "../mysy_img/metier_graphisme.jpg"; import img_met_autre from "../mysy_img/met_autre.jpg"; import img_met_digital from "../mysy_img/met_digital.jpg"; import img_met_management from "../mysy_img/met_management.jpg"; -import img_met_projet from "../mysy_img/met_projet.jpg"; -import img_met_market from "../mysy_img/met_market.jpg"; -import img_met_autre2 from "../mysy_img/met_autre2.jpg"; import img_met_dev_perso from "../mysy_img/metier_dev_perso.jpg"; import img_met_rh from "../mysy_img/met_rh.jpg"; @@ -570,75 +567,7 @@ const Formation_Partner_Catalog = (props) => { - {/*
-
- Type -
- -
- {props.formation.type}   -
-
- -
-
- Support -
- -
- {props.formation.support}   -
-
- - */} - {/*props.formation.zone_diffusion && props.formation.zone_diffusion.country &&
-
- Test : pays -
- -
- {props.formation.zone_diffusion.country}   -
-
*/} - - {/*props.formation.zone_diffusion && props.formation.zone_diffusion.city &&
-
- Test : Ville -
- -
- {props.formation.zone_diffusion.city}   -
-
*/} - - - {/* - {props.formation.presentiel && props.formation.presentiel.presentiel && -
-
- Presentiel -
- -
- - {props.formation.presentiel.presentiel}   - -
-
} - {props.formation.presentiel && props.formation.presentiel.distantiel && -
-
- Distantiel -
- -
- - {props.formation.presentiel.distantiel}   - -
-
} - */} - + } @@ -707,20 +636,6 @@ const Formation_Partner_Catalog = (props) => { } - {/*
-
- Type -
- {props.formation.type && -
- {props.formation.type} -
} - - {!props.formation.type && -
- NC -
} -
*/} diff --git a/src/components/Jmj_Theme/Formation_Partner_Catalog_Special_JMJFormation.js b/src/components/Jmj_Theme/Formation_Partner_Catalog_Special_JMJFormation.js new file mode 100644 index 0000000..6e5e1dd --- /dev/null +++ b/src/components/Jmj_Theme/Formation_Partner_Catalog_Special_JMJFormation.js @@ -0,0 +1,482 @@ +import React, { useState, useEffect } from "react"; + +import { useHistory } from "react-router-dom"; + +import { useCookies } from "react-cookie"; +import { confirmAlert } from 'react-confirm-alert'; + +import img_met_program from "../../mysy_img/met_programmation.jpg"; + +import img_met_graphisme from "../../mysy_img/metier_graphisme.jpg"; + +import img_met_autre from "../../mysy_img/met_autre.jpg"; +import img_met_digital from "../../mysy_img/met_digital.jpg"; +import img_met_management from "../../mysy_img/met_management.jpg"; + +import img_met_dev_perso from "../../mysy_img/metier_dev_perso.jpg"; +import img_met_rh from "../../mysy_img/met_rh.jpg"; + +import img_met_bureautic from "../../mysy_img/met_burautic.jpg"; +import img_met_vente from "../../mysy_img/met_vente.jpg"; +import axios from "axios"; +//import { Rating } from 'react-simple-star-rating' +import Rating from '@mui/material/Rating'; +import parse from 'html-react-parser' +import { CiLocationOn } from "react-icons/ci"; + +const Formation_Partner_Catalog_Special_JMJFormation = (props) => { + const [userconnected, setuserconnected] = useState("0"); + const [partnerconnected, setpartnerconnected] = useState("0"); + const [cookie, setCookie, removeCookie] = useCookies(['tokenmysych']); + const [cookie_part, setCookie_part, removeCookie_part] = useCookies(['tokenmysypart']); + const history = useHistory(); + const [myfilter, setmyfilter] = useState(props.formation.price); + + const [profileimg, setprofileimg] = useState(props.formation.price); + + + // Gestion des Cookies + const stored_partner = cookie_part.tokenmysypart; + const stored_user = cookie.tokenmysych; + + function test(val) { + + if (userconnected === "0" && partnerconnected === "0") { + confirmAlert({ + title: 'Activer votre session ?', + message: 'Merci de vous connecter pour acceder au detail de cette formation', + buttons: [ + { + label: 'Oui', + onClick: () => { history.push("/mysy-training-login/training/" + props.formation.internal_url) } + }, + { + label: 'Non', + onClick: () => { return } + + } + ], + closeOnEscape: false, + closeOnClickOutside: false, + keyCodeForClose: [8, 32], + willUnmount: () => { }, + afterClose: () => { }, + onClickOutside: () => { }, + onKeypress: () => { }, + onKeypressEscape: () => { }, + }); + } else { + window.open( + "/Display-Detail-formation/" + props.formation.internal_url, + '_blank' + ); + } + + + } + + const [myclassimage, setmyclassimage] = useState(); + const [isclassimage, setisclassimage] = useState("False"); + const [userimgclassprofil, setuserimgclassprofil] = useState(""); + + const [class_img_stored_in_bdd, setclass_img_stored_in_bdd] = useState(""); + + function getClassImage_no_token() { + + var myurl = process.env.REACT_APP_API_URL + "myclass/api/getRecodedClassImage_no_token/"; + + var form = new FormData(); + + form.append("type", "partner"); + form.append("related_collection", "myclass"); + form.append("related_collection_recid", props.formation._id); + form.append("class_external_code", props.formation.external_code); + + axios.post(myurl, form).then(res => { + + // console.log(" getClassImage_no_token : In test res.data.status = ", res.data.status); + if (String(res.data.status) === "true") { + + + //console.log(" getClassImage_no_token: res.data.message.img = ", res.data.message); + + if (res.data.message.img.length > 0) { + setisclassimage("True"); + } + else { + setisclassimage("False"); + } + setisclassimage(res.data.message.img); + var ch_img = "data:image/png;base64," + res.data.message.img; + setclass_img_stored_in_bdd(ch_img); + // console.log(" getClassImage_no_token: setclass_img_stored_in_bdd = ", setclass_img_stored_in_bdd); + + } + else { + // console.log(" In Erreur res.data.status = " + res.data.status); + //console.log(" In Erreur res.data.message = " + res.data.message); + setisclassimage("False"); + setuserimgclassprofil(); + setclass_img_stored_in_bdd(); + } + }).catch((error) => { + + console.warn('getClassImage ee: Not good man :( getClassImage = '); + setisclassimage("False"); + setuserimgclassprofil(""); + setclass_img_stored_in_bdd(""); + }) + + } + + + /* Cette variable accompagne la gestion des images par defaut. + idée : si la valeur de "DetailTraining.metier" != "management, digital, office, rh, vente, dev_perso" + alors l'utilisateur à créer une formation avec un metier qui n'est pas geré, donc on met une image par defaut + */ + const [ismetiermanaged, setismetiermanaged] = useState(); + const liste_metier = ["management", "digital", "office", "rh", "vente", "dev_perso"]; + + useEffect(() => { + setmyfilter(props.myfil); + + // console.log(" #### useEffect props.formation = ", props.formation); + + + if (typeof (stored_user) === "undefined" || String(stored_user) === '') { + setuserconnected("0"); + } else { + setuserconnected("1"); + } + + if (typeof (stored_partner) === "undefined" || String(stored_partner) === '') { + setpartnerconnected("0"); + } else { + setpartnerconnected("1"); + } + + getClassImage_no_token(); + GetCurrentClass_trainingsession(); + + GetCurrentClass_trainingsession_cities(); + + // Verifier si le metier est geré + if (props.formation.metier) { + if (!liste_metier.includes(props.formation.metier)) { + setismetiermanaged("0"); // j'ai une valeur dans metier, mais qui n'est pas geré + } + } + else { + setismetiermanaged("0"); + } + + if (props.formation.img_url && String(props.formation.img_url).length > 0) { + setismetiermanaged("1"); + } + + }, []); + + + const [GetCurrentClass_api, setGetCurrentClass_api] = useState(); + const [GetCurrentClass_message, setGetCurrentClass_message] = useState(); + const [GetCurrentClass_result, setGetCurrentClass_result] = useState(); + function GetCurrentClass_trainingsession(event) { + + var form = new FormData(); + + form.append("class_internal_url", props.formation.internal_url); + + form.append("token", stored_partner); + + var myurl = process.env.REACT_APP_API_URL + "myclass/api/GetActiveSessionFormation_List/"; + + axios.post(myurl, form).then(res => { + + if (res.data.status != "false") { + //console.log(" In GetCurrentClass_trainingsession res.data.status = " + res.data.status); + //console.log(" In GetCurrentClass_trainingsession res.data.message r_class = " + res.data.message); + setGetCurrentClass_api("true"); + setGetCurrentClass_result(res.data.message); + } + else { + setGetCurrentClass_api("false"); + setGetCurrentClass_message(res.data.message); + } + + }).catch((error) => { + console.warn('Not good man :( GetCurrentClass_trainingsession = ', error); + setGetCurrentClass_api("false"); + //setmyApimyApiMessage("") + }) + } + + + const [GetCurrentClass_trainingsession_cities_api, setGetCurrentClass_trainingsession_cities_api] = useState(); + const [GetCurrentClass_trainingsession_cities_message, setGetCurrentClass_trainingsession_cities_message] = useState(); + const [GetCurrentClass_trainingsession_cities_result, setGetCurrentClass_trainingsession_cities_result] = useState([]); + function GetCurrentClass_trainingsession_cities(event) { + + var form = new FormData(); + + form.append("class_internal_url", props.formation.internal_url); + + form.append("token", stored_partner); + + var myurl = process.env.REACT_APP_API_URL + "myclass/api/GetActiveSession_Cities_And_Distance_Formation_List/"; + + axios.post(myurl, form).then(res => { + + if (res.data.status != "false") { + //console.log(" In GetCurrentClass_trainingsession_cities res.data.status = " + res.data.status); + //console.log(" In GetCurrentClass_trainingsession_cities res.data.message r_class = " + res.data.message); + setGetCurrentClass_trainingsession_cities_api("true"); + setGetCurrentClass_trainingsession_cities_result(res.data.message); + } + else { + setGetCurrentClass_trainingsession_cities_api("false"); + setGetCurrentClass_trainingsession_cities_message(res.data.message); + } + + }).catch((error) => { + console.warn('Not good man :( GetCurrentClass_trainingsession_cities = ', error); + setGetCurrentClass_trainingsession_cities_api("false"); + //setmyApimyApiMessage("") + }) + } + + const styles = { + list: { + display: 'flex', + flexDirection: 'column', + gap: '32px', + width: '100%', + }, + row: { + display: 'flex', + flexDirection: 'row', + gap: '24px', + width: '100%', + }, + card: { + flexGrow: 1, + backgroundColor: '#fff', + borderRadius: '8px', + overflow: 'hidden', + display: 'flex', + flexDirection: 'column', + }, + image: { + maxWidth: '100%', + height: '200px', + overflow: 'hidden', + marginTop: '-2rem' + + }, + content: { + padding: '16px', + }, + header: { + display: 'flex', + justifyContent: 'space-between', + alignItems: 'center', + }, + eligibility: { + backgroundColor: '#e2e9fb', + padding: '4px 8px', + borderRadius: '4px', + fontSize: '12px', + fontWeight: 'bold', + }, + title: { + fontSize: '14px', + fontWeight: 'bold', + margin: '8px 0', + }, + price: { + fontSize: '14px', + fontWeight: 'bold', + color: '#000', + }, + description: { + fontSize: '12px', + color: '#666', + margin: '8px 0', + height: "40px", + overflow: "hidden", + }, + details: { + display: 'flex', + justifyContent: 'space-between', + marginTop: '16px', + }, + button: { + backgroundColor: '#007bff', + color: '#fff', + padding: '8px 16px', + border: 'none', + borderRadius: '4px', + cursor: 'pointer', + }, + buttonOutline: { + backgroundColor: '#fff', + color: '#007bff', + padding: '8px 16px', + border: '1px solid #007bff', + borderRadius: '4px', + cursor: 'pointer', + }, + }; + + return ( + +
+ + +
+
+ +
 
+ + {props.formation.cpf && String(props.formation.cpf) === String("1") &&
+ {"OUI CPF"} +
+ } + {props.formation.cpf && String(props.formation.cpf) !== String("1") &&
+ {"NON CPF"} +
+ } + {!props.formation.cpf && String(props.formation.cpf) !== String("1") &&
+ {"NON CPF"} +
} + +
+ + + {class_img_stored_in_bdd && String(class_img_stored_in_bdd).length > 50 && + Formation + } + + {(!class_img_stored_in_bdd || String(class_img_stored_in_bdd).length < 50) && + (!props.formation.img_url || String(props.formation.img_url).length <= 10) && + String(ismetiermanaged) !== "0" && String(ismetiermanaged) !== "1" && + +
+ + {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("it") && + String(isclassimage) === "False" && informatique} + + {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("graphisme") && + String(isclassimage) === "False" && graphisme} + + {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("management") && + String(isclassimage) === "False" && management} + + {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("digital") && + String(isclassimage) === "False" && digital} + + {(!props.formation.img_url || String(props.formation.img_url).length <= 0) && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("office") && + String(isclassimage) === "False" && office} + + {!props.formation.img_url || String(props.formation.img_url).length <= 0 && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("rh") && + String(isclassimage) === "False" && ressources humaines} + + {!props.formation.img_url || String(props.formation.img_url).length <= 0 && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("vente") && + String(isclassimage) === "False" && vente} + + {!props.formation.img_url || String(props.formation.img_url).length <= 0 && + props.formation.metier && String(props.formation.metier).toLocaleLowerCase() === String("dev_perso") && + String(isclassimage) === "False" && developpement personnel} + + {String(isclassimage) === "True" && developpement personnel} + + +
+ } + + {(!class_img_stored_in_bdd || String(class_img_stored_in_bdd).length < 50) && String(ismetiermanaged) === "0" && String(userimgclassprofil).length > 100 && +
+ autre + {/*props.formation.institut_formation &&
Dispensé par :
+ {String(props.formation.institut_formation)}
*/} +
} + + {(!class_img_stored_in_bdd || String(class_img_stored_in_bdd).length < 50) && String(ismetiermanaged) === "0" && String(userimgclassprofil).length <= 100 && +
+ autre + {/*props.formation.institut_formation &&
Dispensé par :
+ {String(props.formation.institut_formation)}
*/} +
} + + {(!class_img_stored_in_bdd || String(class_img_stored_in_bdd).length < 50) && String(ismetiermanaged) === "1" && +
+ autre + {/*props.formation.institut_formation &&
Dispensé par :
+ {String(props.formation.institut_formation)}
*/} +
} + + +
+
+
+ {props.formation.note && String(props.formation.note).length === 1 && + parseInt(String(props.formation.note)) <= 5 && + + } +
+ +

{String(parse(String(props.formation.title).replace(/(<([^>]+)>)/ig, ''))).substring(0, 50)}

+ {props.formation.discounted_price && props.formation.business_prices &&

{props.formation.discounted_price} € HT 

} + + {props.formation.business_prices && props.formation.business_prices.length <= 0 + &&

{props.formation.price} € HT 

} + + {props.formation.business_prices && props.formation.business_prices.length > 0 && +

+ +

{props.formation.business_prices[0].discounted_price}€ HT  + {props.formation.price} € HT   + ({props.formation.business_prices[0].discount} %)

+

} + +

{String(parse(String(props.formation.description).replace(/(<([^>]+)>)/ig, ''))).substring(0, 80)}...

+
+ +
+
+ + +
+
+ + + +
+ + ) +} + + +export default Formation_Partner_Catalog_Special_JMJFormation; \ No newline at end of file diff --git a/src/components/Jmj_Theme/Jmjformation_Catalogue_Public copy.js b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public copy.js new file mode 100644 index 0000000..4834b4c --- /dev/null +++ b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public copy.js @@ -0,0 +1,4509 @@ +import React, { useRef, useState, useMemo, useEffect } from "react"; + +import "./jmj_formation.css"; + +import { useForm } from "react-hook-form"; +import axios from "axios"; +import Formation_Partner_Catalog from "../Formation_Partner_Catalog"; +import Formation_Partner_Catalog_Special_JMJFormation from "./Formation_Partner_Catalog_Special_JMJFormation"; +import { FaSearch, FaRegArrowAltCircleDown, FaRegArrowAltCircleUp } from 'react-icons/fa'; + +import { IoAppsSharp, IoListSharp } from "react-icons/io5"; +import Formation_Grid_2Col from "../Formation_Grid_2Col"; +import Pagination from "../TestPagination"; + +import { useHistory } from "react-router-dom"; +import { getCookie, removeCookie } from 'react-use-cookie'; +import { Helmet } from "react-helmet"; + +import AideRecherche from "../AideRecherche" +import { useParams } from 'react-router-dom' +import Fotter_Catalog_Pub from "../Fotter_Catalog_Pub"; + + +import { confirmAlert } from 'react-confirm-alert'; // Import +import { useCookies } from "react-cookie"; +import InputRange from 'react-input-range'; +import 'react-input-range/lib/css/index.css'; +import tick_ko from "../../mysy_img/tick_KO.png"; +import img_header from "../../mysy_img2/img_header.png" +import { TbArrowsDownUp } from "react-icons/tb"; + + + +let PageSize = 10; +const Jmjformation_Catalogue_Public_orig = (props) => { + + + + const { type, categorie } = useParams(); + const { NewSearchText } = useParams(); + const [v11, setv11] = useState(""); + const [userconnected, setuserconnected] = useState("0"); + const [TrainingSupport, setTrainingSupport] = useState(""); + const [TrainingType, setTrainingType] = useState(""); + const [TrainingCertif, setTrainingCertif] = useState(""); + const [TrainingCPF, setTrainingCPF] = useState(""); + const [TrainingLang, setTrainingLang] = useState(""); + const [TrainingPrice, setTrainingPrice] = useState(""); + const [SearchText, setSearchText] = useState(""); + const [SearchcitiesText, setSearchcitiesText] = useState(""); + const [result, setResult] = useState(""); + const [myApiResponse, setmyApiResponse] = useState("false"); + const [displayAllClasses, setdisplayAllClasses] = useState("0"); + const [showelement, setshowelement] = useState("init"); + const [country_code, setcountry_code] = useState("FR"); + const [country_name, setcountry_name] = useState("France"); + const [city, setcity] = useState("Paris"); + const [postal, setpostal] = useState("75001"); + const [latitude, setlatitude] = useState("48.861000061035156"); + const [longitude, setlongitude] = useState("2.3380000591278076"); + const [IPv4, setIPv4] = useState("172.71.122.128"); + const [state, setstate] = useState("France"); + const [userIp, setuserIp] = useState("172.71.122.128"); + const [currentPage, setCurrentPage] = useState(1); + const [currentPage2, setCurrentPage2] = useState(1); + const [fin, setfin] = useState(0); + const [ismobilephone, setismobilephone] = useState(); + const [TrainingDistanciel, setTrainingDistanciel] = useState(); + const textInput = useRef(null); + const scrollDiv = useRef(null); + + const [url_subdomain, seturl_subdomain] = useState(window.location.host.split(".")[0]); + + + const [textplaceholder, settextplaceholder] = useState(""); + const [empltysearch, setempltysearch] = useState("1"); + const [empltycitiessearch, setempltycitiessearch] = useState("1"); + + const [filtredistance, setfiltredistance] = useState("0"); + const continent = ['oui', 'non']; + const [selectedcontinent, setselectedcontinent] = useState(""); + const [newresult, setnewresult] = useState(); + const stored_user = getCookie('tokenmysych'); + const history = useHistory(); + const [besoinaiderecherche, setbesoinaiderecherche] = useState(""); + const [istrier, setistrier] = useState(); + const [selectmetier, setselectmetier] = useState(); + const [initAllfiter, setinitAllfiter] = useState(); + const testDivRef = useRef(null); + const [partcookie, setpartCookie, removepartCookie] = useCookies(['tokenmysypart']); + const inputEl = useRef(null); + + + + + const url = process.env.REACT_APP_API_URL + "myclass/api/add_user_account/"; + const { + register, + formState: { errors }, + handleSubmit, + watch, + } = useForm(); + const pwd = useRef({}); + pwd.current = watch("pwd", ""); + + + + const onSubmit = async (data) => { + + searchFunction(); + }; + + const [Trainingdistance, setTrainingdistance] = useState(0); + const handleInput = (e) => { + setTrainingdistance(e.target.value); + } + + const [Trainingduration, setTrainingduration] = useState(0); + const handleInputDuration = (e) => { + setTrainingduration(e.target.value); + } + + + function showdisplayfilter(event) { + + if (showelement == "true") { + setshowelement("false"); + document.getElementById('block_partner').style.top = "5200px" + document.getElementById('pieddepage_v2').style.top = "5800px" + } + else if (showelement == "false") { + setshowelement("true"); + document.getElementById('block_partner').style.top = "6300px" + document.getElementById('pieddepage_v2').style.top = "6800px" + } + + + } + + function clearsearchtext(event) { + setSearchText(""); + setResult([]); + document.getElementById("SearchText").value = ""; + setempltysearch("1") + setbesoinaiderecherche(""); + settext(""); + DisplayXfirstClas(); + } + + const [suggestion2, setsuggestion2] = useState([]); + const [suggestioncities, setsuggestioncities] = useState([]); + + function SearchTextHandle(event) { + setempltysearch("0"); + setSearchText(event.target.value); + + var val = String(event.target.value).toLocaleLowerCase(); + let matches = []; + // 13/01 : A faire absolument. j'ai bloqué car bug d'affichage (pas au bon endroit) + + if (String(val).length > 2) { + matches = suggestedwords.filter(usr => { + //alert(JSON.parse(usr).name ); + const regex = new RegExp(`${val}`, "gi"); + return JSON.parse(usr).name.match(regex); + } + + ) + + } + + //console.log("matches = " + matches); + setsuggestion2(matches); + settext(event.target.value); + } + + function SearchcitiesHandle(event) { + setempltycitiessearch("0"); + setSearchcitiesText(event.target.value); + + var val = String(event.target.value).toLocaleLowerCase().trimStart(); + const regex = new RegExp(`^${val}`, "gi"); + + let matches = []; + + if (String(val).length > 2) { + matches = suggestedcities.filter(usr => { + return JSON.parse(usr).ville.match(regex); + }) + } + + //console.log("matches = " + matches); + setsuggestioncities(matches); + setcities(event.target.value); + + } + + + const [v1, setv1] = useState(); + const [v2, setv2] = useState(); + + + function TrainingSupportHandle(event) { + setsupportchecked("1"); + var toto = ""; + var filtre1 = ""; + var filtre2 = ""; + var filtre3 = ""; + + var crit_TrainingSupport = ""; + var crit_TrainingSupport22 = ""; + + + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + + //console.log("crit_TrainingSupport = ", crit_TrainingSupport); + + if (crit_TrainingSupport.length > 0) { + filtre1 = result.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + setv11(filtre1); + } + else if (crit_TrainingSupport.length <= 0) { + /* l'utilisateur a choisi d'annuler le filter */ + annulefiltresupportchecked(); + return; + //filtre1 = result; + //setv11(filtre1); + } + } + + + + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + // recuperation du filtre du type (cours, tuto, etc) + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value; + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value; + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + } + // Recup du filtre de prix + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + if (range_price.min && range_price.max) { + filtre1 = filtre1.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + + setv11(filtre1); + } + + + setnewresult(filtre1); + + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + + } + + + + function TrainingCertifHandle(event) { + + var ele = document.querySelector('input[name="TrainingCertif"]:checked').value + + var toto = ""; + var filtre1 = ""; + var filtre2 = ""; + var filtre3 = ""; + + setcertifchecked(""); + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + setcertifchecked("1"); + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value + if (crit_TrainingCertif.length > 0) { + //alert(" laa = " + crit_TrainingCertif); + //console.log(result) + filtre1 = result.filter((maformation) => String(JSON.parse(maformation).certif) === String(crit_TrainingCertif)); + setv11(filtre1); + } + + } else { + + filtre1 = result; + setv11(filtre1); + } + + /* + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.querySelector('input[name="TrainingSupport"]:checked')) { + crit_TrainingSupport = document.querySelector('input[name="TrainingSupport"]:checked').value + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + */ + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + + // recuperation du filtre du type + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + // Recup du filtre de prix + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + if (range_price.min && range_price.max) { + filtre1 = filtre1.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + + setv11(filtre1); + } + + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + + + return; + } + + + + // Pour le CPF + const [cpfchecked, setcpfchecked] = useState(); + function TrainingCPFHandle(event) { + + var ele = document.querySelector('input[name="TrainingCPF"]:checked').value + var myelement; + + if (document.getElementById('rech_middlebox')) { + myelement = document.getElementById('rech_middlebox'); + } + + + var toto = ""; + var filtre1 = ""; + var filtre2 = ""; + var filtre3 = ""; + + setcpfchecked(""); + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + setcpfchecked("1"); + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value + if (crit_TrainingCPF.length > 0) { + //alert(" crit_TrainingCPF = " + crit_TrainingCPF); + + filtre1 = result.filter((maformation) => String(JSON.parse(maformation).cpf) === String(crit_TrainingCPF)); + setv11(filtre1); + //console.log(" #### ",filtre1); + } + + } else { + + filtre1 = result; + setv11(filtre1); + } + + // recuperation du filtre du certificat + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + + // recuperation du filtre du type + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + + + } + + // Recup du filtre de prix + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + if (range_price.min && range_price.max) { + filtre1 = filtre1.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + + setv11(filtre1); + } + + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + if (myelement) { + myelement.scrollIntoView({ behavior: 'smooth' }); + } + + return; + } + + + // END PR CPF + function TrainingTypeHandle(event) { + + settypechecked("1"); + var toto = ""; + var filtre1 = ""; + var filtre2 = ""; + var filtre3 = ""; + + var myelement; + + if (document.getElementById('rech_middlebox')) { + myelement = document.getElementById('rech_middlebox'); + } + + var crit_TrainingPrice = ""; + + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value + if (crit_TrainingType.length > 0) { + filtre1 = result.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + setv11(filtre1); + } + + } else { + + filtre1 = result; + setv11(filtre1); + } + + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + // recuperation du filtre du certificat + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + // Recup du filtre de prix + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + if (range_price.min && range_price.max) { + filtre1 = filtre1.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + + setv11(filtre1); + } + + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + + if (myelement) { + // 👇 Will scroll smoothly to the top of the next section + myelement.scrollIntoView({ behavior: 'smooth' }); + + } + + + return; + + + + + + } + + + function TrainingLangHandle(event) { + setTrainingLang(event.target.value); + alert("newresult newresultnewresultnewresult = " + newresult); + } + + + function TrainingPriceHandle(event) { + + + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + setTrainingPrice(event.target.value); + var toto = ""; + var filtre1 = ""; + + + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + var myprices = crit_TrainingPrice.split(':'); + if (range_price.min && range_price.max) { + filtre1 = result.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + //console.log(" PRICEEEEEEEEEEEEEEEE = "+filtre1); + setv11(filtre1); + } + else { + //alert(" Annulation du filtre prix"); + filtre1 = result; + setv11(filtre1); + } + + + + // Recuperation des autres filtres. + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + } + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + + // recuperation du filtre du certification + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + } + + // recuperation du filtre du type (cours, tuto, etc) + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value; + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value; + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + + setnewresult(filtre1); + setCurrentPage2(1); + + } + + + // Traitement du filtre presentiel / distantiel + function TrainingDistancielHandle(event) { + + + isonsite(); + setlieuchecked("1"); + var toto = ""; + var filtre1 = ""; + var filtre0 = []; + var filtre01 = []; + var my_ville = ""; + var my_cp = ""; + + if (document.getElementById("ville")) { + my_ville = crit_TrainingSupport = document.getElementById("ville").value; + my_ville = my_ville.trim(); + + } + + if (document.getElementById("zip_code")) { + my_cp = crit_TrainingSupport = document.getElementById("zip_code").value; + my_cp = my_cp.trim(); + + } + + var crit_Trainingdistance = ""; + // Recuperation du filtre principale modifié dans ce event (distance) + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value; + //alert("crit_Trainingdistance = " + crit_Trainingdistance); + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + + if (String(crit_Trainingdistance) === String("1")) { + + filtre1 = result.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = result.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + + // Traitement du nom de la ville + if (my_ville.length > 3) { + + var filtre2 = filtre1.map(obj => { + + if (JSON.parse(obj).datelieu) { + + var tmp = JSON.parse(obj).datelieu.length + var i = 0; + while (i < tmp) { + //console.log(JSON.parse(obj).datelieu[i]); + //console.log(" ville =" + JSON.parse(obj).datelieu[i].ville) + if (JSON.parse(obj).datelieu[i].ville === my_ville) { + return obj + } + i++; + } + } + + }); + + var filtre3 = filtre2.filter(function (element) { + return element !== undefined; + }); + + + filtre1 = filtre3; + } + + // Traitement du zip code + if (my_cp.length > 2) { + + var filtre2 = filtre1.map(obj => { + + if (JSON.parse(obj).datelieu) { + + var tmp = JSON.parse(obj).datelieu.length + var i = 0; + while (i < tmp) { + //console.log(JSON.parse(obj).datelieu[i]); + //console.log(" ville =" + JSON.parse(obj).datelieu[i].ville) + if (JSON.parse(obj).datelieu[i].code_postal.startsWith(my_cp)) { + return obj + } + i++; + } + } + + }); + + var filtre3 = filtre2.filter(function (element) { + return element !== undefined; + }); + + + filtre1 = filtre3; + } + + setv11(filtre1); + + + } + else if (String(crit_Trainingdistance) === String("NA")) { + + filtre1 = result; + setv11(filtre1); + } + } + else if (crit_Trainingdistance.length <= 0) { + + filtre1 = result; + setv11(filtre1); + } + } + + + /* Recuperation des autres filtres */ + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + } + + // recuperation du filtre du certification + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + } + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + + // recuperation du filtre du type (cours, tuto, etc) + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value; + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + } + + // Recup du filtre de prix + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + if (range_price.min && range_price.max) { + filtre1 = filtre1.filter((maformation) => Number(JSON.parse(maformation).price) >= Number(range_price.min) && + Number(JSON.parse(maformation).price) <= Number(range_price.max) + ); + + setv11(filtre1); + } + + + setnewresult(filtre1); + setCurrentPage2(1); + } + + + + function displayAllClassesHandle(event) { + setdisplayAllClasses(event.target.checked); + if (event.target.checked == true) + document.getElementById("SearchText").disabled = true; + else + document.getElementById("SearchText").disabled = false; + } + + + const [suggestedwords, setsuggestedwords] = useState([]); + const [texte, settext] = useState(""); + + const [cities, setcities] = useState(""); + + const [suggestedcities, setsuggestedcities] = useState([]); + + + + useEffect(() => { + + var ip = ""; + + Get_Subdomain_Partner_Data(window.location.host) + + async function fetchData() { + // const result = await axios('https://geolocation-db.com/json/',); + + + let windowWidth = window.innerWidth; + + if (showelement === "init") { + + if (windowWidth < 601) { + setismobilephone(true); + setshowelement("false"); + settextplaceholder("Plus de 10 000 formations (gratuites, payantes...)"); + + } else if (windowWidth >= 601) { + setismobilephone(false); + setshowelement("true"); + //settextplaceholder("Ex : graphiste ...sur plus de 10 000 formations (gratuites, payantes,..)"); + settextplaceholder("Recherche par Titre, Description, Contenu video ... sur plus de 10 000 formations (gratuites, payantes,..)"); + } + } + + + if (categorie && String(categorie).length > 0) { + + getClassByMetier_categorie(categorie); + + } + else { + + DisplayXfirstClas(result.data); + + } + } + + + fetchData(); + + + const listener = event => { + if (event.code === "Enter" || event.code === "NumpadEnter") { + event.preventDefault(); + searchFunction(); + } + }; + document.addEventListener("keydown", listener); + + + if (typeof (stored_user) === "undefined" || String(stored_user) === '') { + setuserconnected("0"); + } else { + setuserconnected("1"); + } + + + setinitAllfiter(); + + whosisconnected(); + + + }, [initAllfiter, categorie]); + + + // Cette fonction reinitialise les filtres + function InitAllfilters() { + //document.getElementById("TrainingCertif").selectedv = 0; + const $select = document.querySelector('#TrainingCertif'); + $select.value = '' + + const $select2 = document.querySelector('#TrainingSupport'); + $select2.value = '' + + const $select3 = document.querySelector('#TrainingType'); + $select3.value = '' + + const $select4 = document.querySelector('#TrainingPresentiel'); + $select4.value = 'NA' + + const $select5 = document.querySelector('#TrainingPrice'); + $select5.value = 'NA' + + + + } + + function DisplayClassByDomainFilter() { + var tab_domaine = list_domaine.split(";") + //console.log("tab_domaine = ", tab_domaine) + + if (tab_domaine.length <= 0) { + setdomaine_v11(domaine_v11_orig); + DisplayXfirstClas(); + return; + } + + + + } + + const handleChangeMetier = (event) => { + + var local_list_metier = "" + + + for (let i = 0; i < event.length; i++) { + const label = event[i].label; + const value = event[i].value; + + local_list_metier += value + ";" + + } + + //console.log(" ### local_list_metier = ",local_list_metier); + setlist_metier(local_list_metier); + //TrainingMetierHandle(); + + // Verification si on a une valeur + if (event.length > 0 && local_list_metier.trim().length > 0) { + getClassByMetier(local_list_metier); + } else { + DisplayClassByDomainFilter(); + } + + } + + + + const [domaine_metier, setdomaine_metier] = useState([]); + const [domaine_metier_orig, setdomaine_metier_orig] = useState([]); + + const [domaine_formation, setdomaine_formation] = useState([]); + + const [domaine_v11, setdomaine_v11] = useState(""); + const [domaine_v11_orig, setdomaine_v11_orig] = useState(""); + + const [list_domaine, setlist_domaine] = useState(""); + const [list_metier, setlist_metier] = useState(""); + + const handleChangeDomaine = (event) => { + + + if (event.length <= 0) { + setdomaine_v11(domaine_v11_orig); + DisplayXfirstClas(); + return; + } + //console.log(domaine_metier); + //console.log(" taille =" + event.length); + //console.log(domaine_v11_orig); + + var tt = domaine_v11_orig; + var dump = []; + var local_list_domaine = "" + + + for (let i = 0; i < event.length; i++) { + const label = event[i].label; + const value = event[i].value; + + local_list_domaine += value + ";" + + tt = domaine_v11_orig.filter((maformation) => maformation.domaine === String(value)); + //console.log(" TT = ", tt); + + for (let i2 = 0; i2 < tt.length; i2++) { + //console.log(" push de ", tt[i2]) + dump.push(tt[i2]); + } + + setlist_domaine(local_list_domaine); + setdomaine_v11(dump); + } + + getClassByDomaine(local_list_domaine); + + + + } + + + + const currentTableData2 = useMemo(() => { + if (newresult) { + const firstPageIndex = (currentPage2 - 1) * PageSize; + const lastPageIndex = firstPageIndex + PageSize; + setfin(1); + return newresult.slice(firstPageIndex, lastPageIndex); + } + + + if (result) { + const firstPageIndex = (currentPage2 - 1) * PageSize; + const lastPageIndex = firstPageIndex + PageSize; + setfin(1); + return result.slice(firstPageIndex, lastPageIndex); + } + else { + return []; + setfin(0); + } + }, [currentPage2]); + + function searchFunction(e) { + // Nettoyage du resultat precedent. + setResult([]); + + var crit_TrainingSupport = ""; + var crit_TrainingType = ""; + var crit_TrainingCertif = ""; + var crit_TrainingLang = ""; + var crit_TrainingPresentiel = ""; + var crit_TrainingPrice = ""; + var crit_TrainingDuration = ""; + var my_ville = ""; + + var my_cp = ""; + + var my_domaine = ""; + + + + if (document.getElementById("searchdomain")) + my_domaine = document.getElementById("searchdomain").value; + + + + //Get Criterias + var crit_SearchText = document.getElementById("SearchText").value; + + if (document.getElementById("TrainingSupport")) + crit_TrainingSupport = document.getElementById("TrainingSupport").value; + + if (document.getElementById("TrainingType")) + crit_TrainingType = document.getElementById("TrainingType").value; + + if (document.getElementById("TrainingCertif")) + crit_TrainingCertif = document.getElementById("TrainingCertif").value; + if (crit_TrainingCertif.length == 0) + crit_TrainingCertif = "NA"; + + + if (document.getElementById("TrainingLang")) + crit_TrainingLang = document.getElementById("TrainingLang").value; + + if (document.getElementById("TrainingPresentiel")) + crit_TrainingPresentiel = document.getElementById("TrainingPresentiel").value; + + if (document.getElementById("TrainingPrice")) + crit_TrainingPrice = document.getElementById("TrainingPrice").value; + + if (document.getElementById("duration")) + crit_TrainingDuration = document.getElementById("duration").value; + + + if (document.getElementById("ville")) { + my_ville = crit_TrainingSupport = document.getElementById("ville").value; + + } + + if (document.getElementById("zip_code")) { + my_cp = crit_TrainingSupport = document.getElementById("zip_code").value; + + } + + + var crit_Trainingdistance = Trainingdistance; + + //console.log(" my_domaine = ", my_domaine); + + /*console.log('SearchText = ' + crit_SearchText + ' - TrainingSupport = ' + crit_TrainingSupport + + ' - TrainingType = ' + crit_TrainingType + ' - TrainingCertif ' + crit_TrainingCertif + + " Langue = " + crit_TrainingLang + " TrainingPrice = " + crit_TrainingPrice + + " - Distance = " + crit_Trainingdistance + " -- Presentiel :" + crit_TrainingPresentiel + + " - Duration = " + crit_TrainingDuration + " - stored_user_cookie = " + stored_user);*/ + + + var form = new FormData(); + form.append("search_text", crit_SearchText); + + + var my_local_user_connect; + var my_local_part_connect; + if (typeof (stored_user) === "undefined" || String(stored_user) === '') { + my_local_user_connect = 0; + } else { + my_local_user_connect = 1; + } + + if (typeof (stored_part) === "undefined" || String(stored_part) === '') { + my_local_part_connect = 0; + } else { + my_local_part_connect = 1; + } + + + + if (String(my_local_user_connect) === "1") { + form.append("token", stored_user); + form.append("connection_type", "user"); + } + else if (String(my_local_part_connect) === "1") { + form.append("token", stored_part); + form.append("connection_type", "partner"); + } + else { + form.append("token", ""); + form.append("connection_type", ""); + } + form.append("certif", crit_TrainingCertif); + form.append("support", crit_TrainingSupport); + form.append("type", crit_TrainingType); + form.append("lang", crit_TrainingLang); + form.append("price", crit_TrainingPrice); + form.append("distance", crit_Trainingdistance); + form.append("duration", crit_TrainingDuration); + + + // Ajout des info IP user + form.append("user_ip", IPv4); + form.append("user_country_code", country_code); + form.append("user_country_name", country_name); + form.append("user_city", city); + form.append("user_postal", postal); + form.append("user_latitude", latitude); + form.append("user_longitude", longitude); + form.append("user_state", state); + form.append("subdomain", "colasrail"); + + + var myurl = "" + if (displayAllClasses == true) { + myurl = process.env.REACT_APP_API_URL + "myclass/api/get_all_class_Given_partner_owner_recid_No_Login/"; + } + else { + myurl = process.env.REACT_APP_API_URL + "myclass/api/recherche_text_simple_for_partner_catalog/"; + + } + + // alert("myurl = " + myurl); + axios.post(myurl, form).then(res => { + if (String(res.data.status) != String("false")) { + //console.log(" In test res.data.status = " + res.data.status); + //console.log(" In test res.data.message = " + res.data.message); + setmyApiResponse("True"); + setResult(res.data.message) + + //Verification si le resutlat est vide + if (res.data.message.length <= 0) { + setbesoinaiderecherche("1"); + } + /*if (scrollDiv.current) { + scrollDiv.current.scrollIntoView({ behavior: "smooth" }); + }*/ + + var myelement; + + if (document.getElementById('rech_middlebox')) { + myelement = document.getElementById('rech_middlebox'); + } + + if (myelement) { + myelement.scrollIntoView({ behavior: 'smooth' }); + } + + } + + else { + //console.log(" In test res.data.status = " + res.data.status); + //console.log(" In test res.data.message = " + res.data.message); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + //textInput.current.focus(); + } + + + }).catch((error) => { + // console.warn('Not good man :( mysearchtext = '); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + }) + + // window.scrollTo(0, 600); + + + + + } + + // Cette fonction affiche les X premieres formations + function DisplayXfirstClas(ip) { + + // Nettoyage du resultat precedent. + setResult([]); + + + + //Get Criterias + var crit_SearchText = ""; + var myurl = ""; + + var form = new FormData(); + form.append("search_text", crit_SearchText); + + + if (typeof (NewSearchText) === "undefined" || String(NewSearchText) === '') { + crit_SearchText = ""; + myurl = process.env.REACT_APP_API_URL + "myclass/api/get_all_class_Given_partner_owner_recid_No_Login/"; + form.append("subdomain", "colasrail"); + + //console.log(" ######### laaaaaaaaaaaaa subdomain = ", window.location.host.split(".")[0]) + + + } else { + crit_SearchText = NewSearchText; + myurl = process.env.REACT_APP_API_URL + "myclass/api/recherche_text_simple_for_partner_catalog/"; + + } + + + + + + var my_local_user_connect; + var my_local_part_connect; + + if (typeof (stored_user) === "undefined" || String(stored_user) === '') { + my_local_user_connect = 0; + } else { + my_local_user_connect = 1; + } + + if (typeof (stored_part) === "undefined" || String(stored_part) === '') { + my_local_part_connect = 0; + } else { + my_local_part_connect = 1; + } + + if (String(my_local_user_connect) === "1") { + form.append("token", stored_user); + form.append("connection_type", "user"); + } + else if (String(my_local_part_connect) === "1") { + form.append("token", stored_part); + form.append("connection_type", "partner"); + } + else { + form.append("token", ""); + form.append("connection_type", ""); + } + + form.append("certif", ""); + form.append("support", ""); + form.append("type", ""); + form.append("lang", ""); + form.append("price", ""); + form.append("distance", ""); + form.append("duration", ""); + form.append("cpf", ""); + + + + // Ajout des info IP user + if (ip) { + //console.log(" ### with IP"); + form.append("user_ip", ip.IPv4); + form.append("user_country_code", ip.country_code); + form.append("user_country_name", ip.country_name); + form.append("user_city", ip.city); + form.append("user_postal", ip.postal); + form.append("user_latitude", ip.latitude); + form.append("user_longitude", ip.longitude); + form.append("user_state", ip.state); + } + else { + //console.log(" ### with OUT IP"); + form.append("user_ip", IPv4); + form.append("user_country_code", country_code); + form.append("user_country_name", country_name); + form.append("user_city", city); + form.append("user_postal", postal); + form.append("user_latitude", latitude); + form.append("user_longitude", longitude); + form.append("user_state", state); + // alert(" rrtt "); + } + + + //alert("myurl = " + myurl); + axios.post(myurl, form).then(res => { + if (String(res.data.status) != String("false")) { + //console.log(" In test res.data.status = " + res.data.status); + //console.log(" In DisplayXfirstClas res.data.message = " + res.data.message); + + setmyApiResponse("True"); + setResult(res.data.message) + // textInput.current.focus(); + setbesoinaiderecherche(""); + + } + else { + //console.log(" In test res.data.status = " + res.data.status); + //console.log(" In test res.data.message = " + res.data.message); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + //textInput.current.focus(); + } + + + }).catch((error) => { + // console.warn('Not good man :( mysearchtext = '); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + }) + + + } + + const [trier_par, settrier_par] = useState("1"); + + function trier(e) { + + setistrier(); + var trierpar = "" + if (document.getElementById("trierpar")) + trierpar = document.getElementById("trierpar").value; + + if (String(trierpar) === String("duration")) { + setCurrentPage2(1); + setCurrentPage(1); + + if (typeof (newresult) === "undefined" || String(newresult) === '') { + + //console.log(" AVANT TRIE : [0].duration = " + JSON.parse(result[0]).duration + " - [1].duration = " + JSON.parse(result[1]).duration) + result.sort(function (a, b) { + if (trier_par === "1") + return JSON.parse(a).duration - JSON.parse(b).duration; + else + return JSON.parse(b).duration - JSON.parse(a).duration; + }); + + //console.log("APRES TRIE : [0].duration = " + JSON.parse(result[0]).duration + " - [1].duration = " + JSON.parse(result[1]).duration) + + setistrier("1"); + } + else if (typeof (newresult) !== "undefined" || newresult.length > 0) { + newresult.sort(function (a, b) { + if (trier_par === "1") + return JSON.parse(a).duration - JSON.parse(b).duration; + else + return JSON.parse(b).duration - JSON.parse(a).duration; + }); + } + } + + else if (String(trierpar) === String("price")) { + setCurrentPage2(1); + + if (typeof (newresult) === "undefined" || String(newresult) === '') { + //console.log(" AVANT TRIE : [0].price = " + JSON.parse(result[0]).price + " - [1].price = " + JSON.parse(result[1]).price); + result.sort(function (a, b) { + + if (trier_par === "1") + return JSON.parse(a).price - JSON.parse(b).price; + else + return JSON.parse(b).price - JSON.parse(a).price; + }); + //console.log("APRES TRIE : [0].price = " + JSON.parse(result[0]).price + " - [1].price = " + JSON.parse(result[1]).price); + setistrier("2"); + } + else if (typeof (newresult) !== "undefined" || newresult.length > 0) { + newresult.sort(function (a, b) { + if (trier_par === "1") + return JSON.parse(a).price - JSON.parse(b).price; + else + return JSON.parse(b).price - JSON.parse(a).price; + }); + } + } + + else if (String(trierpar) === String("note")) { + setCurrentPage2(1); + + if (typeof (newresult) === "undefined" || String(newresult) === '') { + //console.log(" AVANT TRIE : [0].price = " + JSON.parse(result[0]).price + " - [1].price = " + JSON.parse(result[1]).price); + result.sort(function (a, b) { + if (trier_par === "1") + return JSON.parse(b).note - JSON.parse(a).note; + else + return JSON.parse(a).note - JSON.parse(b).note; + }); + //console.log("APRES TRIE : [0].price = " + JSON.parse(result[0]).price + " - [1].price = " + JSON.parse(result[1]).price); + setistrier("2"); + } + else if (typeof (newresult) !== "undefined" || newresult.length > 0) { + newresult.sort(function (a, b) { + if (trier_par === "1") + return JSON.parse(b).note - JSON.parse(a).note; + else + return JSON.parse(a).note - JSON.parse(b).note; + }); + } + } + + if (trier_par === "1") + settrier_par("-1"); + else + settrier_par("1"); + + } + + + function getClassByMetier_categorie(mycate) { + + var mymetier = mycate; + + + // Nettoyage du resultat precedent. + setResult([]); + var myurl = process.env.REACT_APP_API_URL + "myclass/api/get_class_by_metier/"; + + /*if (mymetier === "tout") { + //alert(" tout et sortir"); + setinitAllfiter("1"); + return; + + }*/ + + var form = new FormData(); + form.append("metier", mymetier); + form.append("token", ""); + + + //alert("myurl = "+myurl); + axios.post(myurl, form).then(res => { + if (String(res.data.status) != String("false")) { + + setmyApiResponse("True"); + setResult(res.data.message) + //textInput.current.focus(); + setbesoinaiderecherche(""); + setnewresult(""); + //console.log(" In getClassByMetier res.data.status = " + res.data.status); + //console.log(" In getClassByMetier res.data.message = " + res.data.message); + //setnewresult(res.data.message); + setCurrentPage2(1); + if (scrollDiv.current) { + scrollDiv.current.scrollIntoView({ behavior: "smooth" }); + } + + // reinitialisation de tous les filtre + + //setmyApimyApiMessage("OK") + //console.log("taille = "+res.data.message.length); + } + else { + //console.log(" In getClassByMetier res.data.status = " + res.data.status); + //console.log(" In getClassByMetier res.data.message = " + res.data.message); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + //textInput.current.focus(); + } + + + }).catch((error) => { + console.warn(' getClassByMetier : Not good man :( mysearchtext = '); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + }) + + } + + + function getClassByDomaine(List_Domaine) { + + // Nettoyage du resultat precedent. + setResult([]); + var myurl = process.env.REACT_APP_API_URL + "myclass/api/get_class_by_domaine/"; + + /*if (mymetier === "tout") { + //alert(" tout et sortir"); + setinitAllfiter("1"); + return; + + }*/ + + var form = new FormData(); + form.append("domaine", List_Domaine); + form.append("token", ""); + + + //alert("myurl = "+myurl); + axios.post(myurl, form).then(res => { + if (String(res.data.status) != String("false")) { + + setmyApiResponse("True"); + setResult(res.data.message) + //textInput.current.focus(); + setbesoinaiderecherche(""); + setnewresult(""); + //console.log(" In getClassByDomaine res.data.status = " + res.data.status); + //console.log(" In getClassByDomaine res.data.message = " + res.data.message); + //setnewresult(res.data.message); + setCurrentPage2(1); + if (scrollDiv.current) { + scrollDiv.current.scrollIntoView({ behavior: "smooth" }); + } + + // reinitialisation de tous les filtre + + //setmyApimyApiMessage("OK") + //console.log("taille = "+res.data.message.length); + } + else { + //console.log(" In getClassByMetier res.data.status = " + res.data.status); + //console.log(" In getClassByMetier res.data.message = " + res.data.message); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + //textInput.current.focus(); + } + + + }).catch((error) => { + console.warn(' getClassByMetier : Not good man :( mysearchtext = '); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + }) + + } + + function ReinitFilters() { + // Reinitialisation des filtre + annulefiltrecertif(); + annulefiltresupportchecked(); + annulefiltretypechecked(); + annulefiltrelieuchecked(); + annulefiltrecpf(); + } + + const [mymetier, setmymetier] = useState(""); + + function getClassByMetier(my_liste_metier) { + + + if (NewSearchText && NewSearchText.length > 2) { + alert(" Réinitialiser les filtres pour utiliser cette fonctionalité"); + return; + } + var myelement; + + if (document.getElementById('rech_middlebox')) { + myelement = document.getElementById('rech_middlebox'); + } + + var check_metier = ""; + if (document.querySelector('input[name="metier_radio"]:checked')) { + + check_metier = document.querySelector('input[name="metier_radio"]:checked').value; + } + + setmymetier(check_metier); + ReinitFilters(); + + + if (check_metier === "tout") { + // Nettoyage du resultat precedent. + setResult([]); + setnewresult(""); + //alert(" tout et sortir"); + + setdomaine_v11(domaine_v11_orig); + DisplayXfirstClas(); + //setResult([]); + + /*const pieces = window.location.href.split("/") + const last = pieces[pieces.length - 1] + const last2 = pieces[pieces.length - 2] + + if (last === "Recherche_new_v2" || last2 === "Recherche_new_v2") { + console.log(" ## RELAOD"); + window.location.reload(true); + } else { + + + history.push("/Recherche_new_v2"); + } + */ + if (myelement) { + // 👇 Will scroll smoothly to the top of the next section + myelement.scrollIntoView({ behavior: 'smooth' }); + } + return; + + } + + + + // Nettoyage du resultat precedent. + setResult([]); + var myurl = process.env.REACT_APP_API_URL + "myclass/api/get_class_by_metier/"; + + + var form = new FormData(); + form.append("metier", check_metier); + form.append("token", ""); + + //console.log(" recherif pour metier ", check_metier); + //alert("myurl = "+myurl); + axios.post(myurl, form).then(res => { + if (String(res.data.status) != String("false")) { + + setmyApiResponse("True"); + setResult(res.data.message) + //textInput.current.focus(); + setbesoinaiderecherche(""); + setnewresult(""); + //console.log(" In getClassByMetier res.data.status = " + res.data.status); + //console.log(" In getClassByMetier res.data.message = " + res.data.message); + //setnewresult(res.data.message); + setCurrentPage2(1); + if (scrollDiv.current) { + scrollDiv.current.scrollIntoView({ behavior: "smooth" }); + } + + // reinitialisation de tous les filtre + + //setmyApimyApiMessage("OK") + //console.log("taille = "+res.data.message.length); + } + else { + //console.log(" In getClassByMetier res.data.status = " + res.data.status); + //console.log(" In getClassByMetier res.data.message = " + res.data.message); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + //textInput.current.focus(); + } + + + }).catch((error) => { + console.warn(' getClassByMetier : Not good man :( mysearchtext = '); + setmyApiResponse("False"); + //setmyApimyApiMessage("") + }) + + //console.log(" ICI MOVE TO "); + if (myelement) { + // 👇 Will scroll smoothly to the top of the next section + myelement.scrollIntoView({ behavior: 'smooth' }); + } + + } + + + const [PartnerMenu, setPartnerMenu] = React.useState(null); + const [AccountMenu, setAccountMenu] = React.useState(null); + const [ProduitMenu, setproduitMenu] = React.useState(null); + const [AvisMenu, setavisMenu] = React.useState(null); + + + + const PartnerMenu_Close = () => { + setPartnerMenu(null); + }; + + const AccountMenu_Close = () => { + setAccountMenu(null); + }; + + + const ProduitMenu_Close = () => { + setproduitMenu(null); + }; + + const handlePartnerMenu = (event) => { + setPartnerMenu(event.currentTarget); + }; + + const handleAccountMenu = (event) => { + setAccountMenu(event.currentTarget); + }; + + + const handleProduitMenu = (event) => { + setproduitMenu(event.currentTarget); + }; + + + + + const handleClose_Account = () => { + //alert(" my account"); + setAccountMenu(null); + }; + + const handleBlogMenu = (event) => { + setproduitMenu(event.currentTarget); + history.push("/Recherche-Article-formation") + }; + + const handleQuisommesNousMenu = (event) => { + setproduitMenu(event.currentTarget); + history.push("/qui-sommes-nous") + }; + + const handleAccountConnexion = () => { + setAccountMenu(null); + history.push("/Connexion") + }; + + const handleMyAccount = () => { + setAccountMenu(null); + history.push("/mysy-user-account") + }; + + + const handleMyPartnerAccount = () => { + setAccountMenu(null); + history.push("/Partner") + }; + + + const handleAccountCreation = () => { + setAccountMenu(null); + history.push("/create_account") + }; + + const handlePartnerConnexion = () => { + setAccountMenu(null); + history.push("/PartnerLogin") + }; + + + const handleProduitService = () => { + setproduitMenu(null); + history.push("/tarifs_produits_services/") + }; + + const handleAvis = () => { + setavisMenu(null); + history.push("/Recherche-Article-formation") + }; + + function test() { + alert(" coucou"); + } + + + const [someoneconnected, setsomeoneconnected] = useState("0"); + const [partnerconnected, setpartnerconnected] = useState("0"); + const [cookie, setCookie, removeCookie] = useCookies(['tokenmysych']); + + const stored_part = getCookie('tokenmysypart'); + + + + function whosisconnected() { + var local_user_connect = 0; + var local_part_connect = 0; + + if (typeof (stored_user) === "undefined" || String(stored_user) === '') { + setuserconnected("0"); + local_user_connect = 0; + } else { + setuserconnected("1"); + setsomeoneconnected("1"); + local_user_connect = 1; + //alert(" user connected OK"); + } + + if (typeof (stored_part) === "undefined" || String(stored_part) === '') { + setpartnerconnected("0"); + local_part_connect = 0; + } else { + setpartnerconnected("1"); + setsomeoneconnected("1"); + local_part_connect = 1; + //alert(" partner connected OK"); + } + } + + function handleAccountLogout() { + + if (String(userconnected) === String("1")) { + user_logout(); + } + else if (String(partnerconnected) === String("1")) { + part_logout(); + } + } + + function user_logout_confirmation() { + /* si c'est une connexion partner qui est active */ + if (typeof (stored_user) != "undefined") { + setCookie("tokenmysych", ""); + } + history.push("/recherche-formation"); + } + + function user_logout() { + confirmAlert({ + title: '', + message: 'Confirmez la deconnexion (user)', + buttons: [ + { + label: 'Oui', + onClick: () => user_logout_confirmation() + }, + { + label: 'Non', + onClick: () => { return } + } + ] + }); + } + + + + + function handleAccountConnexion_v2() { + + if (String(userconnected) === String("1")) { + handleMyAccount(); + } + else if (String(partnerconnected) === String("1")) { + handleMyPartnerAccount(); + } + } + + + function part_logout_confirmation() { + /* si c'est une connexion partner qui est active */ + if (typeof (stored_part) != "undefined") { + const stored_cookie = getCookie('tokenmysypart'); + var acces_right_token_name = stored_cookie + "_uar"; + + setpartCookie("tokenmysypart", "", { path: '/' }); + + setpartCookie(acces_right_token_name, "", { path: '/' }); + removeCookie(acces_right_token_name, { path: '/' }); + + } + setsomeoneconnected("0"); + setDialog_1_open(false); + history.push("/recherche-formation"); + } + + function part_logout() { + confirmAlert({ + title: '', + message: 'Confirmez la deconnexion (pro)', + buttons: [ + { + label: 'Oui', + onClick: () => part_logout_confirmation() + }, + { + label: 'Non', + onClick: () => { return } + } + ] + }); + } + + const [range_price, setrange_price] = useState({ min: 0, max: 9999, }); + function rangevalue() { + alert(range_price.max + " - " + range_price.min); + //console.log(" range = " + range_price); + } + + const [trainingonsite, settrainingonsite] = useState() + function isonsite() { + settrainingonsite(document.querySelector('input[name="TrainingPresentiel"]:checked').value) + + } + + const [certifchecked, setcertifchecked] = useState(); + function annulefiltrecertif() { + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + var radio = document.querySelector('input[name="TrainingCertif"]:checked'); + radio.checked = false; + setcertifchecked(""); + + var toto = ""; + var filtre1 = ""; + + + // Reinitialisation + filtre1 = result; + setv11(filtre1); + + + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value; + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + // recuperation du filtre du type + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + + } + return; + + + } + + + function annulefiltrecpf() { + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + var radio = document.querySelector('input[name="TrainingCPF"]:checked'); + radio.checked = false; + setcpfchecked(""); + + var toto = ""; + var filtre1 = ""; + + + // Reinitialisation + filtre1 = result; + setv11(filtre1); + + // recuperation du filtre de la certification + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + + // recuperation du filtre du type + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + var crit_TrainingPrice = range_price.min + ":" + range_price.max; + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + + } + return; + + + } + + const [supportchecked, setsupportchecked] = useState(); + function annulefiltresupportchecked() { + //var radio = document.querySelector('input[name="TrainingSupport"]:checked'); + //radio.checked = false; + setsupportchecked(""); + var crit_TrainingSupport = ""; + var toto = ""; + var filtre1 = ""; + + + + // Reinitialisation + filtre1 = result; + setv11(filtre1); + + // recuperation du filtre de la certification + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value; + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + + // recuperation du filtre du type (cours, tuto, etc) + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value; + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + + } + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value; + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + } + // Recup du filtre de prix + var crit_TrainingPrice = ""; + + setnewresult(filtre1); + + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + } + + + const [typechecked, settypechecked] = useState(); + function annulefiltretypechecked() { + + if (document.querySelector('input[name="TrainingType"]:checked')) { + var radio = document.querySelector('input[name="TrainingType"]:checked'); + radio.checked = false; + settypechecked(""); + + var toto = ""; + var filtre1 = ""; + var filtre2 = ""; + var filtre3 = ""; + + + + // Reinitialisation + filtre1 = result; + setv11(filtre1); + //alert("rinitialisation") + ; + + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + + } + + // recuperation du filtre du certificat + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + + } + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value; + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + + // recuperation du filtre de la distance + var crit_Trainingdistance = ""; + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + crit_Trainingdistance = document.querySelector('input[name="TrainingPresentiel"]:checked').value + if (crit_Trainingdistance.length > 0) { + // filtre presentiel = 1 + if (String(crit_Trainingdistance) === String("1")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.distantiel === "1"); + setv11(filtre1); + + } + else if (String(crit_Trainingdistance) === String("0")) { + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).presentiel.presentiel === "1"); + setv11(filtre1); + } + } + + } + + + setnewresult(filtre1); + //alert("crit_TrainingCertif = " + crit_TrainingCertif + " ET crit_TrainingSupport = " + crit_TrainingSupport + " ET crit_TrainingType = " + crit_TrainingType); + //console.log("############################ filtre1 = " + filtre1); + setCurrentPage2(1); + //console.log(" ????????????????????????????filtre2 = "+filtre2); + } + return; + + } + + + const [lieuchecked, setlieuchecked] = useState(); + function annulefiltrelieuchecked() { + if (document.querySelector('input[name="TrainingPresentiel"]:checked')) { + var radio = document.querySelector('input[name="TrainingPresentiel"]:checked'); + radio.checked = false; + setlieuchecked(""); + var toto = ""; + var filtre1 = ""; + settrainingonsite(''); + + + + //reinitialisation des filtres + filtre1 = result; + setv11(filtre1); + + // Annulation de la suggestion de villes + setsuggestioncities([]); + + + /* Recuperation des autres filtres */ + // recuperation du filtre du support + var crit_TrainingSupport = ""; + if (document.getElementById("supoort_list_derou")) { + crit_TrainingSupport = document.getElementById("supoort_list_derou").value; + if (crit_TrainingSupport.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); + } + + // recuperation du filtre du certification + var crit_TrainingCertif = ""; + if (document.querySelector('input[name="TrainingCertif"]:checked')) { + crit_TrainingCertif = document.querySelector('input[name="TrainingCertif"]:checked').value; + if (crit_TrainingCertif.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).certif === crit_TrainingCertif); + } + + // recuperation du filtre du CPF + var crit_TrainingCPF = ""; + if (document.querySelector('input[name="TrainingCPF"]:checked')) { + crit_TrainingCPF = document.querySelector('input[name="TrainingCPF"]:checked').value; + if (crit_TrainingCPF.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).cpf === crit_TrainingCPF); + + } + + // recuperation du filtre du type (cours, tuto, etc) + var crit_TrainingType = ""; + if (document.querySelector('input[name="TrainingType"]:checked')) { + crit_TrainingType = document.querySelector('input[name="TrainingType"]:checked').value; + if (crit_TrainingType.length > 0) + filtre1 = filtre1.filter((maformation) => JSON.parse(maformation).type === crit_TrainingType); + } + setnewresult(filtre1); + setCurrentPage2(1); + } + } + + function OnblurHandle(e) { + setTimeout(() => { + setsuggestion2([]) + }, 100) + } + + + function OnSuggestionHandler(text) { + var val = text; + settext(val); + } + + function OnCitiesSuggestionHandler(text) { + var val = text; + setcities(val); + document.getElementById("ville").value = val; + LeaveCity(); + // Annulation de la suggestion de villes + setsuggestioncities([]); + } + + function publiecatalogue() { + + history.push("/Partner", { mysy_arg: 'partner' }); + } + + function LeaveCity() { + TrainingDistancielHandle(); + } + + function LeaveZipCode() { + TrainingDistancielHandle(); + } + + const Recherche_Domaine_Metier = (event) => { + + //console.log(" ### liste domaine = ", list_domaine); + //console.log(" ### liste metier = ", list_metier); + + } + + const [displayAllmetiers, setdisplayAllmetiers] = useState(); + + function DisplayAllmetier() { + if (displayAllmetiers) + setdisplayAllmetiers(false); + else + setdisplayAllmetiers(true); + } + + + function init_Filter_Change_url() { + history.push("/"); + window.location.reload(); + + /* window.scrollTo({ + top: 0, + behavior: "smooth", + });*/ + + } + + function message_to_init_Filter_Change_url() { + alert(" Réinitialiser les filtres pour réactivier cette fonctionnalité") + + } + + + const [Dialog_1_message, setDialog_1_message] = React.useState(false); + const [Dialog_1_open, setDialog_1_open] = React.useState(false); + function Dialog_1_handle_change_participant_session(message) { + setDialog_1_message(message); + setDialog_1_open(true); + } + + const Dialog_1_handleClose = () => { + //alert(" Utiliser le bouton 'fermer' "); + //setOpen(false); + }; + + const Dialog_1_handleClose_buton = () => { + setDialog_1_open(false); + }; + + + //console.log(" c'est url_subdomain ", url_subdomain); + + const [subdomain_recid, setsubdomain_recid] = useState(""); + const [my_theme_code, setmy_theme_code] = useState(""); + + + const [New_Get_Subdomain_Partner_Data_result, setNew_Get_Subdomain_Partner_Data_result] = useState([]); + + const [Get_Subdomain_Partner_Data_api, setGet_Subdomain_Partner_Data_api] = useState(); + const [Get_Subdomain_Partner_Data_message, setGet_Subdomain_Partner_Data_message] = useState(); + const [Get_Subdomain_Partner_Data_result, setGet_Subdomain_Partner_Data_result] = useState(); + function Get_Subdomain_Partner_Data(local_url_subdomain) { + + let domain = local_url_subdomain; + if (local_url_subdomain.includes("://")) { + domain = url.split('://')[1]; + } + + console.log(" ### local_url_subdomain = ", local_url_subdomain); + + const subdomain = domain.split('.')[0]; + + console.log(" ### subdomain = ", subdomain); + + var form = new FormData(); + + form.append("subdomain", "colasrail"); + + var myurl = process.env.REACT_APP_API_URL + "myclass/api/Get_Partner_Data_From_Subdomain/"; + + axios.post(myurl, form).then(res => { + + if (String(res.data.status) === "true") { + //console.log(" In Get_Subdomain_Partner_Data res.data.status = " + res.data.status); + // console.log(" In Get_Subdomain_Partner_Data res.data.message r_class = " + res.data.message); + setGet_Subdomain_Partner_Data_api("true"); + setGet_Subdomain_Partner_Data_result(res.data.message); + + var new_data2 = []; + const new_data = res.data.message.map((x) => { + + //--- + + var _id = JSON.parse(x)._id; + var recid = JSON.parse(x).recid; + var nom = JSON.parse(x).nom; + + var catalog_pub_logo = JSON.parse(x).catalog_pub_logo; + var catalog_pub_banniere_img = JSON.parse(x).catalog_pub_banniere_img; + + var theme_code = JSON.parse(x).theme_code; + + var catalog_pub_message_1_txt = JSON.parse(x).catalog_pub_message_1_txt; + + var catalog_pub_cgv_pdf = "" + if (JSON.parse(x).catalog_pub_cgv_pdf) + catalog_pub_cgv_pdf = JSON.parse(x).catalog_pub_cgv_pdf; + + + var catalog_pub_cgu_pdf = "" + if (JSON.parse(x).catalog_pub_cgu_pdf) + catalog_pub_cgu_pdf = JSON.parse(x).catalog_pub_cgu_pdf; + + var catalog_pub_mention_legale_pdf = "" + if (JSON.parse(x).catalog_pub_mention_legale_pdf) + catalog_pub_mention_legale_pdf = JSON.parse(x).catalog_pub_mention_legale_pdf; + + + + var catalog_pub_message_1_taille = "12" + if (JSON.parse(x).catalog_pub_message_1_taille) + catalog_pub_message_1_taille = JSON.parse(x).catalog_pub_message_1_taille; + + var catalog_pub_message_1_color = "#000000"; + if (JSON.parse(x).catalog_pub_message_1_color) + catalog_pub_message_1_color = JSON.parse(x).catalog_pub_message_1_color; + + var catalog_pub_message_1_gras = "400" + if (JSON.parse(x).catalog_pub_message_1_gras) + catalog_pub_message_1_gras = JSON.parse(x).catalog_pub_message_1_gras; + + + var catalog_pub_message_2_txt = "" + if (JSON.parse(x).catalog_pub_message_2_txt) + catalog_pub_message_2_txt = JSON.parse(x).catalog_pub_message_2_txt; + + + var catalog_pub_message_2_taille = "12" + if (JSON.parse(x).catalog_pub_message_2_taille) + catalog_pub_message_2_taille = JSON.parse(x).catalog_pub_message_2_taille; + + var catalog_pub_message_2_color = "#000000" + if (JSON.parse(x).catalog_pub_message_2_color) + catalog_pub_message_2_color = JSON.parse(x).catalog_pub_message_2_color; + + var catalog_pub_message_2_gras = "400" + if (JSON.parse(x).catalog_pub_message_2_gras) + catalog_pub_message_2_gras = JSON.parse(x).catalog_pub_message_2_gras; + + + + var catalog_pub_message_3_txt = "" + if (JSON.parse(x).catalog_pub_message_3_txt) + catalog_pub_message_3_txt = JSON.parse(x).catalog_pub_message_3_txt; + + var catalog_pub_message_3_taille = "12" + if (JSON.parse(x).catalog_pub_message_3_taille) + catalog_pub_message_3_taille = JSON.parse(x).catalog_pub_message_3_taille; + + var catalog_pub_message_3_color = "#000000"; + if (JSON.parse(x).catalog_pub_message_3_color) + catalog_pub_message_3_color = JSON.parse(x).catalog_pub_message_3_color; + + var catalog_pub_message_3_gras = "400" + if (JSON.parse(x).catalog_pub_message_3_gras) + catalog_pub_message_3_gras = JSON.parse(x).catalog_pub_message_3_gras; + + // Indicateur 1 + var catalog_pub_indicateur_1_txt = "" + if (JSON.parse(x).catalog_pub_indicateur_1_txt) + catalog_pub_indicateur_1_txt = JSON.parse(x).catalog_pub_indicateur_1_txt; + + var catalog_pub_indicateur_1_color = "#000000"; + if (JSON.parse(x).catalog_pub_indicateur_1_color) + catalog_pub_indicateur_1_color = JSON.parse(x).catalog_pub_indicateur_1_color; + + var catalog_pub_indicateur_1_gras = "400" + if (JSON.parse(x).catalog_pub_indicateur_1_gras) + catalog_pub_indicateur_1_gras = JSON.parse(x).catalog_pub_indicateur_1_gras; + + var catalog_pub_indicateur_1_taille = "12" + if (JSON.parse(x).catalog_pub_indicateur_1_taille) + catalog_pub_indicateur_1_taille = JSON.parse(x).catalog_pub_indicateur_1_taille; + + // Indicateur 2 + var catalog_pub_indicateur_2_txt = "" + if (JSON.parse(x).catalog_pub_indicateur_2_txt) + catalog_pub_indicateur_2_txt = JSON.parse(x).catalog_pub_indicateur_2_txt; + + var catalog_pub_indicateur_2_color = "#000000"; + if (JSON.parse(x).catalog_pub_indicateur_2_color) + catalog_pub_indicateur_2_color = JSON.parse(x).catalog_pub_indicateur_2_color; + + var catalog_pub_indicateur_2_gras = "400" + if (JSON.parse(x).catalog_pub_indicateur_2_gras) + catalog_pub_indicateur_2_gras = JSON.parse(x).catalog_pub_indicateur_2_gras; + + var catalog_pub_indicateur_2_taille = "12" + if (JSON.parse(x).catalog_pub_indicateur_2_taille) + catalog_pub_indicateur_2_taille = JSON.parse(x).catalog_pub_indicateur_2_taille; + + // Indicateur 3 + var catalog_pub_indicateur_3_txt = "" + if (JSON.parse(x).catalog_pub_indicateur_3_txt) + catalog_pub_indicateur_3_txt = JSON.parse(x).catalog_pub_indicateur_3_txt; + + var catalog_pub_indicateur_3_color = "#000000"; + if (JSON.parse(x).catalog_pub_indicateur_3_color) + catalog_pub_indicateur_3_color = JSON.parse(x).catalog_pub_indicateur_3_color; + + var catalog_pub_indicateur_3_gras = "400" + if (JSON.parse(x).catalog_pub_indicateur_3_gras) + catalog_pub_indicateur_3_gras = JSON.parse(x).catalog_pub_indicateur_3_gras; + + var catalog_pub_indicateur_3_taille = "12" + if (JSON.parse(x).catalog_pub_indicateur_3_taille) + catalog_pub_indicateur_3_taille = JSON.parse(x).catalog_pub_indicateur_3_taille; + + + // Indicateur 4 + var catalog_pub_indicateur_4_txt = "" + if (JSON.parse(x).catalog_pub_indicateur_4_txt) + catalog_pub_indicateur_4_txt = JSON.parse(x).catalog_pub_indicateur_4_txt; + + var catalog_pub_indicateur_4_color = "#000000"; + if (JSON.parse(x).catalog_pub_indicateur_4_color) + catalog_pub_indicateur_4_color = JSON.parse(x).catalog_pub_indicateur_4_color; + + var catalog_pub_indicateur_4_gras = "400" + if (JSON.parse(x).catalog_pub_indicateur_4_gras) + catalog_pub_indicateur_4_gras = JSON.parse(x).catalog_pub_indicateur_4_gras; + + var catalog_pub_indicateur_4_taille = "12" + if (JSON.parse(x).catalog_pub_indicateur_4_taille) + catalog_pub_indicateur_4_taille = JSON.parse(x).catalog_pub_indicateur_4_taille; + + // Les contacts publics + var catalog_pub_contact_public_email = "" + if (JSON.parse(x).catalog_pub_contact_public_email) + catalog_pub_contact_public_email = JSON.parse(x).catalog_pub_contact_public_email; + + var catalog_pub_contact_public_telephone = "" + if (JSON.parse(x).catalog_pub_contact_public_telephone) + catalog_pub_contact_public_telephone = JSON.parse(x).catalog_pub_contact_public_telephone; + + + var catalog_pub_theme_id = JSON.parse(x).catalog_pub_theme_id; + + setmy_theme_code(theme_code); + + console.log(" ### setmy_theme_code = ", theme_code); + + + //--- + var node = { + "_id": _id, + "recid": recid, + "nom": nom, + "label": nom, + + "catalog_pub_cgv_pdf": catalog_pub_cgv_pdf, + "catalog_pub_cgu_pdf": catalog_pub_cgu_pdf, + "catalog_pub_mention_legale_pdf": catalog_pub_mention_legale_pdf, + + "catalog_pub_logo": catalog_pub_logo, + "catalog_pub_banniere_img": catalog_pub_banniere_img, + "catalog_pub_message_1_txt": catalog_pub_message_1_txt, + "catalog_pub_message_1_taille": catalog_pub_message_1_taille, + "catalog_pub_message_1_color": catalog_pub_message_1_color, + "catalog_pub_message_1_gras": catalog_pub_message_1_gras, + + + "catalog_pub_message_2_txt": catalog_pub_message_2_txt, + "catalog_pub_message_2_taille": catalog_pub_message_2_taille, + "catalog_pub_message_2_color": catalog_pub_message_2_color, + "catalog_pub_message_2_gras": catalog_pub_message_2_gras, + + + "catalog_pub_message_3_txt": catalog_pub_message_3_txt, + "catalog_pub_message_3_taille": catalog_pub_message_3_taille, + "catalog_pub_message_3_color": catalog_pub_message_3_color, + "catalog_pub_message_3_gras": catalog_pub_message_3_gras, + + /// les indicateurs + "catalog_pub_indicateur_1_txt": catalog_pub_indicateur_1_txt, + "catalog_pub_indicateur_1_color": catalog_pub_indicateur_1_color, + "catalog_pub_indicateur_1_gras": catalog_pub_indicateur_1_gras, + "catalog_pub_indicateur_1_taille": catalog_pub_indicateur_1_taille, + + "catalog_pub_indicateur_2_txt": catalog_pub_indicateur_2_txt, + "catalog_pub_indicateur_2_color": catalog_pub_indicateur_2_color, + "catalog_pub_indicateur_2_gras": catalog_pub_indicateur_2_gras, + "catalog_pub_indicateur_2_taille": catalog_pub_indicateur_2_taille, + + "catalog_pub_indicateur_3_txt": catalog_pub_indicateur_3_txt, + "catalog_pub_indicateur_3_color": catalog_pub_indicateur_3_color, + "catalog_pub_indicateur_3_gras": catalog_pub_indicateur_3_gras, + "catalog_pub_indicateur_3_taille": catalog_pub_indicateur_3_taille, + + "catalog_pub_indicateur_4_txt": catalog_pub_indicateur_4_txt, + "catalog_pub_indicateur_4_color": catalog_pub_indicateur_4_color, + "catalog_pub_indicateur_4_gras": catalog_pub_indicateur_4_gras, + "catalog_pub_indicateur_4_taille": catalog_pub_indicateur_4_taille, + + // les contacts publics + "catalog_pub_contact_public_email": catalog_pub_contact_public_email, + "catalog_pub_contact_public_telephone": catalog_pub_contact_public_telephone, + + "catalog_pub_theme_id": catalog_pub_theme_id, + "theme_code": theme_code, + + }; + // console.log(" --- node = ", node); + new_data2.push(node); + }); + + if (new_data2.length > 0) + setNew_Get_Subdomain_Partner_Data_result(new_data2); + + + if (res.data.message.length > 0) { + var mylocal_materiel = JSON.parse(res.data.message); + + if (mylocal_materiel.recid) + setsubdomain_recid(mylocal_materiel.recid); + else + setsubdomain_recid(""); + + } + + + } + else { + setGet_Subdomain_Partner_Data_api("false"); + setGet_Subdomain_Partner_Data_message(res.data.message); + alert(res.data.message); + } + + }).catch((error) => { + console.warn('Not good man :( Get_Subdomain_Partner_Data = ', error); + setGet_Subdomain_Partner_Data_api("false"); + alert(" Impossible de recuperer les données du sous domaine"); + //setmyApimyApiMessage("") + }) + } + + const [display_mode_grid_or_list, setdisplay_mode_grid_or_list] = useState("list"); + + function func_display_grid_view() { + setdisplay_mode_grid_or_list("grid"); + } + + function func_display_list_view() { + setdisplay_mode_grid_or_list("list"); + } + + + + return ( + + +
+ + + + Formation & Tutoriel Gratuit ou payant Excellente qualité + + + + + + +

my_theme_code = {my_theme_code}

+ {/******* Gestion du THEME "MySy_Theme2" */} + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && String(my_theme_code) === "MySy_Theme2" &&
+ +
+ + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_banniere_img &&
+ + +
} + +
+ +
+ {New_Get_Subdomain_Partner_Data_result[0].nom} +
+ +
+ +   +
+ +
+   +
+
+ + +
+ +
+ +
+ Indicateurs
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt} +
} + +
+
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && + } + + + {New_Get_Subdomain_Partner_Data_result[0] && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_message_2_txt && + } + +
+
+ + Contact
+ Tel : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_telephone}
+ Email : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_email} + +
+
+ +
+ + + +
+ + + +
+ +
+
+ +
Nos Formations & Tutoriels
+ {showelement === "true" &&
+ +
Masquer les Métiers & Filtres
+
+ +
+ } + + {showelement === "false" &&
+
Afficher les Métiers & Filtres
+
+ +
+ } + + {showelement === "true" &&
+
+
Les filtres
+ +
+ +
+
+
+
Eligible CPF +
+
+
+ +
+ + +
+
+ +
+
+ + +
+
+ + {String(cpfchecked) === String("1") &&
+
+ KO + +
+
} + +
+
+ + +
+
Certification +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(certifchecked) === String("1") &&
+
+ KO + +
+
} +
+
+
+
+ +
+
+
+
Type +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(typechecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Lieu +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(lieuchecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + + {trainingonsite && String(trainingonsite) === String("0") &&
+
Ville +
+ +
+ + {suggestioncities && suggestioncities.slice(0, 3).map((suggestion, id) => +
OnCitiesSuggestionHandler(JSON.parse(suggestion).ville)}> {JSON.parse(suggestion).ville}
+ )} + +
+ + +
 
+
} + + {trainingonsite && String(trainingonsite) === String("0") &&
+
Code postale +
+ +
+ +
+ + +
 
+
} + +
+
+ +
+ +
+ +
+
Support +
+ +
+ + + + +
+
+ +
+
Prix +
+ +
+ `${value} €`} + value={range_price} + step={500} + name="toto" + + onChange={value => setrange_price(value)} + //onChange={TrainingPriceHandle} + onChangeComplete={value => console.log(value)} + /> +
+ + +
 
+
+ +
+ +
+ +
+
+ +
+ } + +
+ +
Nos Formations & Tutoriels
+ {String(userconnected) === String("1") &&
+ +
+ } + + {myApiResponse == "False" &&
+ + Impossible de contacter l'hote distant +
} + + {myApiResponse == "True" && String(besoinaiderecherche) === String("1") &&
+ + Le resultat est vide, besoin d'aide ? + + +
} + + + + + + {result && myApiResponse === "True" && !newresult && +
+
+
+ +
+ setCurrentPage2(page)} + /> +
+ + +
+
+ Trier par + + + { + if (trier_par === "1") + settrier_par("-1"); + else + settrier_par("1"); + + trier(); + }} + + /> +
+
+ +
+ {result && result.length > 0 && +
+ + +
} +
+ + +
+ +
+
} + + + + {result && myApiResponse === "True" && newresult && +
+ +
+
+ + setCurrentPage2(page)} + /> + +
+ +
+ {result && result.length > 0 && +
+ + +
} +
+ +
+ + +
} + + + {newresult && (newresult.length <= PageSize) &&
88 +   +
+   +
} + +
 
+ + + + + {String(display_mode_grid_or_list) !== "grid" &&
+ {result && myApiResponse == "True" && fin == 0 && !newresult && + result.slice(0, PageSize).map((formation) => ( +
+ +
+ ))} + + + {result && myApiResponse == "True" && fin == 0 && newresult && + newresult.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + + + {result && myApiResponse === "True" && fin === 1 && !newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse === "True" && fin === 1 && newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} +
} + + + {String(display_mode_grid_or_list) === "grid" &&
+ {result && myApiResponse == "True" && fin == 0 && !newresult && + result.slice(0, PageSize).map((formation) => ( +
+ +
+ ))} + + + {result && myApiResponse == "True" && fin == 0 && newresult && + newresult.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + + + {result && myApiResponse === "True" && fin === 1 && !newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse === "True" && fin === 1 && newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} +
} + + + + + {result && !newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } + + {result && newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } +
+ + + +
+ + +
+ +
+
Notre actualité + +
+ +
+ +
+ +
+ +
+ +
+ +
+ 19 DECEMBRE 2022 +
+ +
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ 19 DECEMBRE 2022 +
+ +
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit +
+ +
+ + +
+ +
+ +
+ +
+ +
+ +
+ 19 DECEMBRE 2022 +
+ +
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit +
+ +
+ + +
+ + + + +
+ +
+ + +
+ +
+
+ + +
+ +
+ + +
} + + {/******* FIN Gestion du THEME "MySy_Theme2" */} + + + + {/******* Gestion du THEME PAR DEFAULT " */} + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && String(my_theme_code) === "MySy_Theme_Default" &&
+ + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_banniere_img &&
+ + +
} + +
+ +
+ {New_Get_Subdomain_Partner_Data_result[0].nom} +
+ +
+ + Contact
+ Tel : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_telephone}
+ Email : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_email} +
+ +
+ Indicateurs
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt} +
} +
+
+ + +
+ +
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && + } + + + {New_Get_Subdomain_Partner_Data_result[0] && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_message_2_txt && + } +
+
+ +
+
+ + +
+
+
+ + +
+
+ +
Nos Formations
+ {showelement === "true" &&
+ +
Masquer les Métiers & Filtres
+
+ +
+ } + + {showelement === "false" &&
+
Afficher les Métiers & Filtres
+
+ +
+ } + + {showelement === "true" &&
+
+
Les filtres
+ + +
+
+
Eligible CPF +
+
+
+ +
+ + +
+
+ +
+
+ + +
+
+ + {String(cpfchecked) === String("1") &&
+
+ KO + +
+
} + +
+
+ + +
+
Certification +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(certifchecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Type +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(typechecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + + {/*
+
Support +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(supportchecked) === String("1") &&
+
+ KO + +
+
} +
+
*/} + + + +
+
Lieu +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(lieuchecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + + {trainingonsite && String(trainingonsite) === String("0") &&
+
Ville +
+ +
+ + {suggestioncities && suggestioncities.slice(0, 3).map((suggestion, id) => +
OnCitiesSuggestionHandler(JSON.parse(suggestion).ville)}> {JSON.parse(suggestion).ville}
+ )} + +
+ + +
 
+
} + + {trainingonsite && String(trainingonsite) === String("0") &&
+
Code postale +
+ +
+ +
+ + +
 
+
} + +
+
Support +
+ +
+ + + + +
+
+ +
+
Prix +
+ +
+ `${value} €`} + value={range_price} + step={500} + name="toto" + + onChange={value => setrange_price(value)} + //onChange={TrainingPriceHandle} + onChangeComplete={value => console.log(value)} + /> +
+ + +
 
+
+ + +
+ + +
+ + + + + +
+ } + +
+ +
Nos Formations
+ {String(userconnected) === String("1") &&
+ +
+ } + + {myApiResponse == "False" &&
+ + Impossible de contacter l'hote distant +
} + + {myApiResponse == "True" && String(besoinaiderecherche) === String("1") &&
+ + Le resultat est vide, besoin d'aide ? + + +
} + + + {result && myApiResponse === "True" && !newresult && +
+
+
+ setCurrentPage2(page)} + /> +
+
+
+ Trier par + + + { + if (trier_par === "1") + settrier_par("-1"); + else + settrier_par("1"); + + trier(); + }} + + /> +
+
+ + +
+ + +
} + + {result && myApiResponse === "True" && newresult && +
+ setCurrentPage2(page)} + /> + + +
} + + + {newresult && (newresult.length <= PageSize) &&
+   +
+   +
} + + + {result && myApiResponse == "True" && fin == 0 && !newresult && + result.slice(0, PageSize).map((formation) => ( +
+ + +
+ ))} + + {result && myApiResponse == "True" && fin == 0 && newresult && + newresult.slice(0, PageSize).map((formation) => ( +
+ + +
+ + ))} + + + + {result && myApiResponse === "True" && fin === 1 && !newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ + +
+ + ))} + + {result && myApiResponse === "True" && fin === 1 && newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ + +
+ + ))} + + + {result && !newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } + + {result && newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } +
+ + + +
+ + +
+
+ + +
+ +
} + {/******* FIN Gestion du THEME PAR DEFAULT " */} + + + + {/******* Gestion du THEME THEME SPECIAL JMJ Formation " */} + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && String(my_theme_code) === "MySy_Theme_JMJ" &&
+ + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_banniere_img &&
+ + +
} + +
+ +
+ {New_Get_Subdomain_Partner_Data_result[0].nom} +
+ +
+ + Contact
+ Tel : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_telephone}
+ Email : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_email} +
+ +
+ Indicateurs
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt} +
} +
+
+ + +
+ +
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && + } + + + {New_Get_Subdomain_Partner_Data_result[0] && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_message_2_txt && + } +
+
+ +
+
+ + +
+
+
+ + +
+
+ +
Nos Formations JMJ Theme
+ {showelement === "true" &&
+ +
Masquer les Métiers & Filtres
+
+ +
+ } + + {showelement === "false" &&
+
Afficher les Métiers & Filtres
+
+ +
+ } + + {showelement === "true" &&
+
+
Les filtres
+ + +
+
+
Eligible CPF +
+
+
+ +
+ + +
+
+ +
+
+ + +
+
+ + {String(cpfchecked) === String("1") &&
+
+ KO + +
+
} + +
+
+ + +
+
Certification +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(certifchecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Type +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(typechecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Support +
+ +
+ + + + +
+
+ +
+
Prix +
+ +
+ `${value} €`} + value={range_price} + step={500} + name="toto" + + onChange={value => setrange_price(value)} + //onChange={TrainingPriceHandle} + onChangeComplete={value => console.log(value)} + /> +
+ + +
 
+
+ + +
+ + +
+ + + + + +
+ } + +
+ +
Nos Formations Theme JMJ
+ {String(userconnected) === String("1") &&
+ +
+ } + + {myApiResponse == "False" &&
+ + Impossible de contacter l'hote distant +
} + + {myApiResponse == "True" && String(besoinaiderecherche) === String("1") &&
+ + Le resultat est vide, besoin d'aide ? + + +
} + + + {result && myApiResponse === "True" && !newresult && +
+
+
+ setCurrentPage2(page)} + /> +
+
+
+ Trier par + + + { + if (trier_par === "1") + settrier_par("-1"); + else + settrier_par("1"); + + trier(); + }} + + /> +
+
+ + +
+ + +
} + + {result && myApiResponse === "True" && newresult && +
+ setCurrentPage2(page)} + /> + + +
} + + + {newresult && (newresult.length <= PageSize) &&
+   +
+   +
} + + + +
+ + {result && myApiResponse == "True" && fin == 0 && !newresult && + result.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse == "True" && fin == 0 && newresult && + newresult.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + + + {result && myApiResponse === "True" && fin === 1 && !newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse === "True" && fin === 1 && newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ + +
+ + ))} + +
+ + + {result && !newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } + + {result && newresult &&
+ + {String(userconnected) === String("1") && } + setCurrentPage2(page)} + /> +
+ } +
+ + + +
+ + +
+ {/*
+ + +
*/} + +
} + {/******* FIN Gestion du THEME SPECIAL JMJ Formation " */} + +
+ + ); +} + + +export default Jmjformation_Catalogue_Public_orig; \ No newline at end of file diff --git a/src/components/Jmjformation_Catalogue_Public.js b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js similarity index 86% rename from src/components/Jmjformation_Catalogue_Public.js rename to src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js index b8db454..308f831 100644 --- a/src/components/Jmjformation_Catalogue_Public.js +++ b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js @@ -1,32 +1,41 @@ import React, { useRef, useState, useMemo, useEffect } from "react"; + +import "./jmj_formation.css"; + import { useForm } from "react-hook-form"; import axios from "axios"; -import Formation_Partner_Catalog from "./Formation_Partner_Catalog"; +import Formation_Partner_Catalog from "../Formation_Partner_Catalog"; +import Formation_Partner_Catalog_Special_JMJFormation from "./Formation_Partner_Catalog_Special_JMJFormation"; import { FaSearch, FaRegArrowAltCircleDown, FaRegArrowAltCircleUp } from 'react-icons/fa'; import { IoAppsSharp, IoListSharp } from "react-icons/io5"; -import Formation_Grid_2Col from "./Formation_Grid_2Col"; -import Pagination from "./TestPagination"; +import Formation_Grid_2Col from "../Formation_Grid_2Col"; +import Pagination from "../TestPagination"; import { useHistory } from "react-router-dom"; import { getCookie, removeCookie } from 'react-use-cookie'; import { Helmet } from "react-helmet"; -import AideRecherche from "./AideRecherche" +import AideRecherche from "../AideRecherche" import { useParams } from 'react-router-dom' -import Fotter_Catalog_Pub from "./Fotter_Catalog_Pub"; +import Fotter_Catalog_Pub from "../Fotter_Catalog_Pub"; import { confirmAlert } from 'react-confirm-alert'; // Import import { useCookies } from "react-cookie"; import InputRange from 'react-input-range'; import 'react-input-range/lib/css/index.css'; -import tick_ko from "../mysy_img/tick_KO.png"; -import img_header from "../mysy_img2/img_header.png" +import tick_ko from "../../mysy_img/tick_KO.png"; +import img_header from "../../mysy_img2/img_header.png" +import img_header_jmg from "../../mysy_img2/img_jmj_modif.jpg" + + import { TbArrowsDownUp } from "react-icons/tb"; -import { CiCircleRemove, CiCircleMinus } from "react-icons/ci"; + + + let PageSize = 10; -const Mon_Catalogue_Public = (props) => { +const Jmjformation_Catalogue_Public = (props) => { @@ -223,23 +232,6 @@ const Mon_Catalogue_Public = (props) => { } } - /* - - - - if (document.querySelector('input[name="TrainingSupport"]:checked')) { - crit_TrainingSupport = document.querySelector('input[name="TrainingSupport"]:checked').value; - if (crit_TrainingSupport.length > 0) { - filtre1 = result.filter((maformation) => JSON.parse(maformation).support === crit_TrainingSupport); - setv11(filtre1); - } - else if (crit_TrainingSupport.length <= 0 || String(crit_TrainingSupport) === String("NA")) { - filtre1 = result; - setv11(filtre1); - } - - } - */ var crit_TrainingCertif = ""; @@ -957,7 +949,7 @@ const Mon_Catalogue_Public = (props) => { fetchData(); - + const listener = event => { if (event.code === "Enter" || event.code === "NumpadEnter") { @@ -2753,18 +2745,19 @@ const Mon_Catalogue_Public = (props) => { return ( -
+
Formation & Tutoriel Gratuit ou payant Excellente qualité - + - {/******* Gestion du THEME "MySy_Theme2" */} + + {/******* Gestion du THEME "MySy_Theme2" */} {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && String(my_theme_code) === "MySy_Theme2" &&
@@ -3502,7 +3495,7 @@ const Mon_Catalogue_Public = (props) => { {/******* Gestion du THEME PAR DEFAULT " */} {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 - && String(my_theme_code) !== "MySy_Theme2" &&
+ && String(my_theme_code) === "MySy_Theme_Default" &&
{New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_banniere_img &&
@@ -3872,7 +3865,7 @@ const Mon_Catalogue_Public = (props) => { - +
} @@ -3972,7 +3965,6 @@ const Mon_Catalogue_Public = (props) => {
- ))} {result && myApiResponse == "True" && fin == 0 && newresult && @@ -4054,10 +4046,406 @@ const Mon_Catalogue_Public = (props) => {
} {/******* FIN Gestion du THEME PAR DEFAULT " */} + + + + + {/******* Gestion du THEME THEME SPECIAL JMJ Formation " */} + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && String(my_theme_code) === "MySy_Theme_JMJ" && + +
+ +
+
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_banniere_img &&
+ + +
} + + +
+ +
+ +
+ {New_Get_Subdomain_Partner_Data_result[0].nom} +
+ +
+ + Contact
+ Tel : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_telephone}
+ Email : {New_Get_Subdomain_Partner_Data_result[0].catalog_pub_contact_public_email} +
+ +
+ Indicateurs
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_1_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_2_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_3_txt} +
} + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 + && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt && +
{New_Get_Subdomain_Partner_Data_result[0].catalog_pub_indicateur_4_txt} +
} +
+ +
+
+ {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && + + } + + {New_Get_Subdomain_Partner_Data_result && New_Get_Subdomain_Partner_Data_result.length > 0 && + } + + + + + {New_Get_Subdomain_Partner_Data_result[0] && New_Get_Subdomain_Partner_Data_result[0].catalog_pub_message_2_txt && + } +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+
+
+
+ {showelement === "true" &&
+
+ + +
+
+
Eligible CPF +
+
+
+ +
+ + +
+
+ +
+
+ + +
+
+ + {String(cpfchecked) === String("1") &&
+
+ KO + +
+
} + +
+
+ + +
+
Certification +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(certifchecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Type +
+ +
+
+
+ + +
+
+ +
+
+ + +
+
+ {String(typechecked) === String("1") &&
+
+ KO + +
+
} +
+
+ + +
+
Support +
+ +
+ + + + +
+
+ +
+
Prix +
+ +
+ `${value} €`} + value={range_price} + step={500} + name="toto" + + onChange={value => setrange_price(value)} + //onChange={TrainingPriceHandle} + onChangeComplete={value => console.log(value)} + /> +
+ + +
 
+
+ + +
+ + +
+ +
+ } +
+ +
+
+

Nos Formations

+ +
+ + +
+ {result && myApiResponse === "True" && !newresult && +
+
+
+ setCurrentPage2(page)} + /> +
+
+
+ Trier par + + + { + if (trier_par === "1") + settrier_par("-1"); + else + settrier_par("1"); + + trier(); + }} + + /> +
+
+ + +
+ + +
} + + +
+ +
+ +
+ + {result && myApiResponse == "True" && fin == 0 && !newresult && + result.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse == "True" && fin == 0 && newresult && + newresult.slice(0, PageSize).map((formation) => ( +
+ +
+ + ))} + + + + {result && myApiResponse === "True" && fin === 1 && !newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ +
+ + ))} + + {result && myApiResponse === "True" && fin === 1 && newresult + && currentTableData2 + && currentTableData2.map((formation) => ( +
+ + +
+ + ))} + +
+
+
+ + +
+
+ +
+
+
+ +
+ +
} + {/******* FIN Gestion du THEME SPECIAL JMJ Formation " */} +
); } -export default Mon_Catalogue_Public; \ No newline at end of file +export default Jmjformation_Catalogue_Public; \ No newline at end of file diff --git a/src/components/Jmj_Theme/jmj_formation.css b/src/components/Jmj_Theme/jmj_formation.css new file mode 100644 index 0000000..342b21d --- /dev/null +++ b/src/components/Jmj_Theme/jmj_formation.css @@ -0,0 +1,14810 @@ +.jmj_formation { + + .css-1nmdiq5-menu { + background: transparent !important; + color: white !important; + z-index: 999; + } + + .css-qbdosj-Input { + background: transparent !important; + } + + + .h1_transparent { + color: transparent; + font-size: 0.1rem; + } + + + .cta_recherche_img_search_loup { + width: 50%; + margin-right: -5px; + } + + .cta_recherche_TXT_search_loup { + display: none; + } + + @media only screen and (max-width: 600px) { + .calage { + display: none; + } + + .block_pagination { + width: 100%; + float: left; + + } + + .block_trier_par { + width: 100%; + float: left; + } + + + + + + /*style smartphones et petites tablettes en portrait*/ + + .text_head { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: small; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .containerBox { + position: relative; + display: inline-block; + margin-top: 0.5rem; + } + + input::placeholder { + font-size: 0.7rem; + color: black; + } + + .align_gauche { + margin-left: 0rem; + width: 100%; + float: left; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: x-small; + } + + .btn-primary { + margin-top: 0.25rem !important; + } + + .filter_dist { + width: 70% !important; + text-align: left; + } + + .recherchedivgauche { + width: 90%; + border-radius: 0.5rem; + float: left; + text-align: center; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + } + + .okUpdateData { + font-size: 0.7rem; + color: green; + font-style: italic; + } + + .koUpdateData { + font-size: small; + color: red; + font-style: italic; + } + + .recherchedivdroite { + width: 5%; + border-radius: 0rem; + float: right; + align-content: flex-end; + border-left: 0.1rem solid; + border-left-color: #ced4da; + } + + .recherchefilter { + margin-top: 1.2rem; + display: inline-block; + width: 97%; + background-color: black; + color: white; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + margin: 0; + text-align: left; + border-radius: 5px; + margin-bottom: 0.1rem; + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + height: 2rem; + padding-top: 5px; + margin-bottom: 0.5rem; + + } + + .rech_container { + width: 90%; + height: 200px; + background: aqua; + margin: auto; + padding: 2px; + border-radius: 30px; + } + + .rech_leftbox { + float: left; + border-width: 1px; + width: 98%; + + margin: auto; + padding: 0.3rem; + + + margin-bottom: 0.1rem; + font-family: "verdana", "Quicksand", "Signika", sans-serif !important; + background: white; + margin-left: 1%; + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + margin-top: 0.5rem; + margin-right: auto; + margin-bottom: 10px; + height: auto; + } + + .rech_middlebox { + float: left; + border-width: 2px; + width: 100%; + height: 100%; + margin: auto; + padding: 0.1rem; + border-radius: 30px; + margin-right: 0.5%; + padding: 15px; + + } + + .rech_rightbox { + display: none; + } + + .textsurimage { + color: rgb(218, 207, 207); + background-color: transparent; + font-size: 1.5rem; + text-align: center; + position: absolute; + top: 30%; + left: 50%; + transform: translate(-50%, -50%); + position: re; + } + + .rech_list_formation2 { + display: inline-block; + width: 100%; + background-color: white; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + + margin: 0; + text-align: left; + border-radius: 10px; + margin-bottom: 10px; + + + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%); + } + + .rech_list_formation2:hover { + -webkit-box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + } + + input[type="submit"] { + width: 100%; + margin-top: 0; + } + + h3 { + font-size: 1rem; + } + + .form { + position: relative; + margin-top: 0.5rem !important; + margin-bottom: 0.5rem; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + text-align: left; + height: 3rem !important; + display: flex; + width: 98%; + display: flex; + + } + + .textsurimage23 { + color: rgb(218, 207, 207); + background-color: transparent; + text-align: center; + position: absolute; + top: 15%; + left: 20%; + width: 20rem; + } + + h4 { + display: inline-block; + font-size: medium; + /*or whatever you want*/ + color: white; + } + + .default_font { + color: #3c4043; + display: inline-block; + line-height: 28px; + font-size: small; + } + + .ch_recherche { + margin-left: 10%; + margin-right: 10%; + background-color: white; + align-items: center; + } + + .input-group-text2 { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + border-radius: 0.2rem; + } + + .rech_list_formation { + display: inline-block; + width: 100%; + background-color: #eee; + height: auto; + padding: 1em; + outline: 1px solid #ccc; + border: 1px solid #999; + background-color: #999; + margin: 0 auto; + text-align: left; + } + + .height { + height: 100vh; + } + + .form .fa-search { + position: absolute; + top: 20px; + left: 20px; + color: #9ca3af; + } + + .input-group-text { + font-size: 0.6rem !important; + } + + .form-select { + font-size: 1rem !important; + padding: auto; + } + + .mb-3 { + margin-bottom: 0.5rem !important; + cursor: pointer; + } + + .verti_middle { + margin-top: 2rem !important; + } + + .form span { + position: absolute; + right: 0.1rem; + top: 0.1rem; + padding: 1.5px; + + height: 1.9rem; + margin-top: 5px; + } + + form svg { + margin-top: 0.6rem !important; + cursor: pointer; + } + + .ch_form_svg { + svg { + margin-top: 0rem !important; + } + } + + .form span_clear { + position: absolute; + right: 1.5rem !important; + top: 0.1rem !important; + padding: 2px; + border-left: 0.2rem solid #d1d5db !important; + height: 1.9rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + .left-pan { + padding-left: 7rem; + } + + .left-pan i { + padding-left: 10px; + } + + .form-input { + color: black; + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 12px 0px 24px; + gap: 72px; + width: 100%; + background: #FFFFFF; + box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.08); + border-radius: 8px; + flex: none; + flex-grow: 0; + flex-grow: 0; + order: 0; + flex-grow: 0; + border: 1px solid #E2E9FB; + border-radius: 60px; + height: 3rem; + font-size: medium; + } + + .text-box { + position: absolute; + height: 100%; + text-align: center; + width: 100%; + } + + .text-box:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + } + + .img_logo { + display: block; + height: auto; + margin-left: auto; + margin-right: auto; + max-width: 50%; + } + + .filter_span { + padding-top: 0.3rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + color: #107758; + font-size: 0.75rem; + white-space: nowrap; + width: 20%; + + } + + .filter_val { + padding-top: 0.1rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + font-size: 0.75rem; + white-space: nowrap; + border: none; + background: transparent; + color: #3b3e40; + font-family: "DM Sans", "verdana", "Quicksand", "Signika"; + border: 1px solid #C7C9CE; + border-radius: 0.3rem !important; + width: 65%; + margin-top: 0.3rem; + margin-right: 0px; + } + + .div_row2 { + float: left; + + border-width: 0.01rem; + width: 100%; + margin-bottom: 0.1rem; + + position: fixed; + z-index: 10; + top: 0px; + } + + .div_row_haut { + float: left; + + width: 100%; + + background-color: #3b3e40; + z-index: 10; + } + + .div_row_bas { + float: right; + + width: 100%; + + z-index: 10; + background-color: #e7f3fb; + background-image: url("../../mysy_img/MYSY-banner-compte_v2.png"); + + } + + .div_mobile { + position: relative; + top: 8rem; + z-index: 1; + width: 98%; + height: 100%; + margin: 0.3rem; + margin-left: auto; + margin-right: auto; + } + + .pieddepage { + z-index: 50; + width: 100%; + float: left; + color: white !important; + } + + .menuPrincipal { + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + width: 20%; + float: right; + font-weight: 500; + cursor: pointer; + } + + .menuPrincipal:hover { + color: #81bc3a; + font-weight: bold; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.2rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; + } + + .div_001 { + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_002 { + width: 50%; + text-align: center; + margin-left: auto; + margin-right: auto; + } + + .div_003 { + display: none; + } + + .div_004 { + color: white; + width: 100%; + height: 0.1rem; + opacity: 100%; + margin-left: auto; + margin-right: auto; + float: left; + margin-bottom: 0.2rem; + margin-top: 0.2rem; + } + + .div_005 { + width: 100%; + margin-left: auto; + margin-right: auto; + color: black !important; + height: 4rem; + } + + .hilightsoustitre { + background: #113459; + color: #fff; + display: block; + font-size: 0.85rem; + margin-bottom: 0.5rem; + } + + .hilightsoustitre_v2 { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + } + + .hilightsoustitre_v2_metier { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + } + + .tab_gauche { + width: 50%; + float: left; + text-align: left; + } + + .tab_droite { + width: 50%; + float: right; + text-align: right; + } + + .tab_gauche_metier { + width: 20%; + float: left; + text-align: left; + } + + .tab_droite_metier { + width: 20%; + float: right; + text-align: right; + } + + .img_thematique_metier { + display: block; + border-radius: 10rem; + max-width: 360px; + } + + .met_polaroid_gauche { + width: 97%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 2px; + } + + .met_polaroid_droite { + width: 97%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + margin-left: 3%; + border-radius: 2px; + } + + .met_container { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + font-weight: bold; + } + + .met_text { + margin-bottom: 0.1rem; + font-size: x-small; + white-space: nowrap; + overflow: hidden; + font-weight: bold; + } + + .met_text_larg { + margin-bottom: 0.1rem; + font-size: xx-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + } + + .met_text_all_categories { + margin-bottom: 0.1rem; + font-size: x-small; + margin-top: 1rem; + } + + .met_container_all_categories { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + height: 4rem; + } + + .met_polaroid_gauche_all_categories { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .tab_gauche_all_categories { + width: 100%; + float: left; + text-align: left; + } + + .img_categorie { + width: 100%; + border-top-right-radius: 2px; + border-radius: 2px; + padding: 5px; + } + + .met_polaroid, + .met_polaroid_line2 { + display: none; + } + + .bienvenu { + display: none; + } + + .new_filter_zone { + float: left; + width: 35%; + display: flex; + align-items: center; + font-size: smaller; + line-height: 1.5; + color: #212529; + text-align: center; + white-space: nowrap; + background-color: #e9ecef; + border: 1px solid #ced4da; + } + + .new_filter_zone_cerif_radio { + width: 30%; + float: left; + text-align: right; + font-size: smaller; + } + + .new_filter_zone_cerif_radio_right { + + float: left; + text-align: left; + font-size: small; + padding-left: 5px; + } + + .new_filter_zone_cerif_radio_left { + + float: left; + text-align: center; + font-size: small; + padding-right: 15px; + padding-left: 2px; + min-width: 30%; + } + + .range_prix_mobile { + margin-left: 1rem; + } + + .new_filter_zone_row { + margin-bottom: 0.7rem !important; + width: 100%; + padding-right: 5px; + } + + .tick_ok_ko { + max-width: 50%; + margin-top: 8px; + } + + .tab_logo_metier { + width: 100%; + padding-left: 5px; + } + + .tab_critere_espace { + margin-bottom: 1rem; + padding-bottom: 0rem; + width: 100%; + } + + + .Background_Header { + /* Background Header */ + + + position: absolute; + width: 100%; + height: 350px; + left: 0px; + + + /* Beige */ + + background: #f3f4fb; + z-index: -1; + } + + .Menu_Header { + display: none; + } + + .block_nos_service { + position: absolute; + width: 100%; + height: 100px; + left: 0px; + top: 474px; + + /* White */ + + background: #FFFFFF; + + display: none; + + } + + .logo { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + position: absolute; + width: 108px; + height: 52px; + left: 150px; + top: 30px; + } + + + .Logo_MySy { + width: 108px; + height: 36px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .training { + + width: 108px; + height: 12px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 900; + font-size: 10px; + line-height: 12px; + /* identical to box height */ + + letter-spacing: 0.83em; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .title_desc_header { + width: 100%; + float: left; + + margin-bottom: 2rem; + } + + .block_nos_formation { + padding: 0px; + width: 100%; + } + + .pieddepage_v2 { + position: relative; + width: 100%; + + left: 0px; + + top: 5800px; + background: #FFF5DA; + z-index: -1; + } + + .frame_153 {} + + .frame_153_txt { + position: absolute; + width: 100%; + text-align: left; + height: 34px; + + top: 250px; + + font-family: 'Albert Sans'; + font-style: normal; + font-size: 12px; + line-height: 17px; + display: flex; + align-items: center; + + /* Deep Blue */ + + color: #0A043C; + } + + + + .title1 { + width: 100%; + text-align: center; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 54px; + letter-spacing: 1px; + color: #0A043C; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + padding-top: 1.5rem; + } + + + .title2 { + position: absolute; + height: 35px; + left: 5%; + top: 90px; + font-family: "Albert Sans"; + font-style: normal; + font-size: 14px; + line-height: 19px; + letter-spacing: 1px; + text-align: center; + color: #0A043C; + font-weight: 500; + + + } + + .content_search_bar { + margin-top: 3rem; + width: 94%; + margin-left: 3%; + + } + + .search_bar_h { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 10px; + + width: 100%; + height: 113px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_bar {} + + + + .input_search_bar { + /* Auto layout */ + + flex-direction: row; + align-items: center; + padding: 0px; + gap: 24px; + + width: 100%; + height: 80px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .cta_recherche { + cursor: pointer; + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 10px 2px; + gap: 10px; + + + + /* Green */ + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + width: 100%; + + } + + .cta_recherche_txt { + + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 17px; + line-height: 30px; + /* identical to box height, or 176% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .search_dropdown { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + + flex: none; + order: 0; + flex-grow: 0; + margin-bottom: 1rem; + width: 100%; + + } + + + .search_bar_rectangle { + width: 1px; + height: 60px; + + background: rgba(0, 0, 0, 0.08); + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_text { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 8px; + + width: 100%; + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + + .forma_et_tuto { + display: none; + } + + .forma_et_tuto_mobile { + display: none; + } + + + .domaine_icone { + display: none; + } + + .domaine_icone_fa { + margin-top: 8px; + width: 5%; + cursor: pointer; + } + + + .sous_filter { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + margin-bottom: 3rem; + } + + .sous_filter_metier { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_txt { + /* Les filtres */ + height: 24px; + letter-spacing: 1px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 18px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_separator { + width: 277px; + height: 0px; + + opacity: 0.08; + /* Deep Blue */ + + border: 1px solid #0A043C; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 12px; + + width: 277px; + height: 494px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_mertier { + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 277px; + height: 496px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .filter_valeur { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 71px; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .filter_valeur_txt { + /* Eligible CPF */ + + letter-spacing: 2px; + height: 19px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 19px; + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .filter_valeur_block_val { + /* List Checkbox */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 90%; + height: 48px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + margin-left: 5%; + } + + .frame_133 { + /* Frame 133 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 1; + } + + .frame_133_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 50px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_radio { + /* Radio Button */ + + cursor: pointer; + width: 16px; + height: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_txt { + /* Oui */ + + + width: 26px; + height: 22px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .frame_134 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_134_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 55px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .frame_135 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_135_grp { + /* Checbox + Text */ + + margin-left: 10px; + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 30px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + + .filter_txt { + /* Les filtres */ + + + width: 92px; + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block { + /* Filter */ + + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 16px; + gap: 10px; + + width: 90%; + height: 70px; + + /* White */ + + background: #FFFFFF; + border: 1px solid #DFDFDF; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + + } + + .filter_metier_sous_block_content { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 12px; + + width: 180px; + height: 40px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_radio { + + /* Radio Button */ + + + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_txt { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 144px; + height: 40px; + + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_formation { + width: 144px; + height: 22px; + + margin-top: 10px; + text-align: left; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_nb { + width: 85px; + height: 14px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 14px; + + /* Deep Blue */ + + color: #0A043C; + + opacity: 0.7; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .Header_Content { + width: 100%; + float: left; + + + margin-bottom: 5rem; + + } + + + .filter_metier_sous_block_plus_metier { + /* Icon + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 233px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_1 { + border: #0A043C solid; + width: 24px; + height: 24px; + cursor: pointer; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_2 { + width: 201px; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_actualite { + /* Actualité */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + position: absolute; + width: 100%; + height: 549px; + top: 4700px; + display: none; + } + + .block_actualite_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 100%; + height: 453px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_actualite_sous_block_text { + width: 261px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 30px; + line-height: 38px; + /* identical to box height */ + + text-align: center; + letter-spacing: 2px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 4%; + + width: 90%; + height: 365px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_list_actu_actu1 { + + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 23px; + + width: 32%; + height: 364px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_img { + width: 100%; + height: 250px; + + background: url(https://img.mysy-training.com/img_actu1.png), #D9D9D9 no-repeat; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text { + /* Date + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 1px; + gap: 8px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_date { + height: 19px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 12px; + line-height: 1p5x; + text-transform: uppercase; + + /* Blue */ + + color: #3E6EE3; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_txt { + + height: 64px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 22px; + /* or 133% */ + + letter-spacing: 0.2px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .bton_tout_nos_article { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .bton_tout_nos_article_account_box { + display: none; + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .bton_tout_nos_article_txt { + width: 156px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 20px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_partner { + /* Partner Block */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 20px; + gap: 10px; + + position: absolute; + width: 95%; + height: 386px; + top: 5200px; + + /* White */ + + background: #FFFFFF; + /* Shadow 01 */ + + box-shadow: 0px 54px 100px rgba(10, 4, 60, 0.08); + border-radius: 8px; + + } + + .block_partner_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 24px; + + width: 100%; + height: 306px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + + + width: 100%; + height: 226px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_logo { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 4px; + + width: 160px; + height: 70px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_desc { + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 25px; + line-height: 28px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_txt { + width: 100%; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_buton { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Green */ + + background: #20BFA9; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .logo_not_absolut { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .block_partner_sous_block_logo_desc_desc2 { + width: 100%; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 20px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_newletter { + display: none; + } + + .block_newletter_email { + display: none; + } + + .block_newletter_bton_ok { + display: none; + } + + .block_newletter_bton_bton_ok { + display: none; + } + + .cta_recherche_img_search_loup { + display: none; + } + + .cta_recherche_TXT_search_loup { + display: block; + + width: 100%; + + border-radius: 60px; + height: 40px; + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 6px 8px; + height: 34px; + background: #3E6EE3; + border-radius: 200px; + flex: none; + flex-grow: 0; + order: 0; + align-self: stretch; + flex-grow: 0; + + background-color: #3e6ee3; + color: #ffffff; + border: none; + + } + + .block_formation { + flex: 1 1 300px; + display: flex; + flex-direction: column; + gap: 40px; + + background-color: rgba(253, 246, 236, 0.1); + border-radius: 12px; + border: 1px solid #ecae49; + max-width: 400px; + box-sizing: border-box; + flex-grow: 1; + background: #FFF; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; + display: flex; + flex-direction: column; + border: 1px solid #E2E9FB + } + + .block_display_flex_formation { + display: flex; + flex-direction: row; + gap: 15px; + width: 100%; + flex-wrap: wrap; + justify-content: left; + } + } + + + @media only screen and (min-width: 601px) and (max-width: 991px) { + + .block_pagination { + width: 50%; + float: left; + + } + + .block_trier_par { + width: 40%; + float: right; + } + + /*style petites-moyennes tablettes */ + .domaine_icone { + display: none + } + + .div_row { + float: left; + border-width: 0.01rem; + width: 100%; + margin-bottom: 1rem; + border-radius: 1rem; + } + + .div_row_gauche { + float: left; + border-width: 0.01rem; + width: 48%; + border-radius: 1rem; + } + + .div_row_droite { + float: right; + border-width: 0.01rem; + width: 48%; + border-radius: 1rem; + } + + .align_gauche { + margin-left: 0rem; + overflow-y: hidden; + white-space: nowrap; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + width: 100%; + } + + .recherchefilter { + display: none; + } + + .filter_dist { + width: 70% !important; + text-align: left; + } + + .okUpdateData { + font-size: small; + color: green; + font-style: italic; + } + + .koUpdateData { + font-size: small; + color: red; + font-style: italic; + } + + .rech_container { + width: 90%; + height: 200px; + background: aqua; + margin: auto; + padding: 10px; + border-radius: 30px; + } + + + .rech_leftbox { + border-width: 1px; + + height: auto; + padding: 0.1rem; + border-radius: 1rem; + margin-bottom: 0.1rem; + font-family: "DM Sans" !important; + background: white; + margin-left: 5px; + margin-top: 0.5rem; + padding-left: 5px; + + width: 80%; + margin-left: 10%; + } + + .rech_middlebox { + float: left; + border-width: 2px; + width: 64%; + height: 100%; + margin: auto; + padding: 0rem; + border-radius: 30px; + margin-right: 0%; + padding-left: 1rem; + padding-right: 10px; + } + + .textsurimage { + color: rgb(218, 207, 207); + background-color: transparent; + font-size: 40pt; + text-align: center; + position: absolute; + top: 30%; + left: 50%; + transform: translate(-50%, -50%); + position: absolute; + } + + .rech_list_formation2 { + display: inline-block; + width: 100%; + background-color: white; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + margin: 0; + text-align: left; + border-radius: 10px; + margin-bottom: 10px; + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + } + + .rech_list_formation2:hover { + -webkit-box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + } + + h3 { + font-size: 2rem; + } + + .form { + font-size: medium; + margin-left: auto; + margin-right: auto; + margin-bottom: 0.5rem; + position: relative; + margin-top: 1rem; + z-index: 11; + display: flex; + } + + .textsurimage23 { + color: rgb(218, 207, 207); + background-color: transparent; + text-align: center; + position: absolute; + top: 20%; + left: 30%; + width: 20rem; + } + + h4 { + display: inline-block; + font-size: x-large; + /*or whatever you want*/ + color: white; + } + + .default_font { + color: #3c4043; + display: inline-block; + line-height: 28px; + font-size: small; + } + + .form-input { + border-radius: 10rem; + height: 2.5rem; + font-size: medium; + + line-height: 1.5; + margin-bottom: 2px; + color: white; + border: 2px solid white; + background: transparent; + box-shadow: none; + } + + form svg { + margin-top: 0.8rem !important; + cursor: pointer; + } + + .form span { + position: absolute; + right: 0.2rem; + top: 0.1rem; + padding: 2px; + border-left: 0.2rem solid #d1d5db; + height: 2.4rem; + } + + form svg { + margin-top: 0.8rem !important; + cursor: pointer; + } + + .form span_clear { + position: absolute; + right: 2rem !important; + top: 0.1rem !important; + padding: 2px; + border-left: 0.2rem solid #d1d5db !important; + height: 2.4rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + .left-pan { + padding-left: 7px; + } + + .left-pan i { + padding-left: 10px; + } + + .containerBox { + position: relative; + display: inline-block; + margin-top: 0.5rem; + } + + .text-box { + position: absolute; + height: 100%; + text-align: center; + width: 100%; + } + + .text-box:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + } + + .img_logo { + display: block; + height: auto; + margin-left: 0px; + margin-right: auto; + max-width: 30%; + } + + + .form-select { + height: 1.5rem !important; + border-radius: 0px; + font-size: small; + } + + .mb-3 { + margin-bottom: 0.5rem !important; + cursor: pointer; + } + + .input-group-text { + font-size: 0.6rem !important; + padding-left: 0rem !important; + padding-right: 0.2rem !important; + } + + .rech_rightbox { + /* opacity: 1; + border: 1px; + outline: 0; + border-bottom: 2px solid transparent; + color: white; + font-size: medium !important; + border-radius: 1rem; + margin: 0px; + padding: 0px; + text-align: center; + margin-bottom: 0.5rem; + padding-top: 0.5rem;*/ + display: none; + } + + .rech_rightbox .button2 { + opacity: 1; + background: #619e31; + border: 1px; + outline: 0; + border-bottom: 2px solid transparent; + color: white; + font-size: medium !important; + border-radius: 1rem; + margin: 0px; + padding: 0px; + text-align: center; + margin-bottom: 0.5rem; + } + + .rech_rightbox_inside { + float: left; + width: 100%; + height: 100%; + margin: auto; + padding: 0px; + border-radius: 0px; + margin-right: 0%; + overflow-y: scroll; + height: 800px; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: medium; + padding-right: 5px; + margin-right: 5px; + } + + .filter_span { + padding-top: 0.3rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + color: #107758; + font-size: 0.75rem; + white-space: nowrap; + width: 20%; + + } + + .filter_val { + padding-top: 0.1rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + font-size: 0.75rem; + white-space: nowrap; + border: none; + background: transparent; + color: #3b3e40; + font-family: "DM Sans", "verdana", "Quicksand", "Signika"; + border: 1px solid #C7C9CE; + border-radius: 0.3rem !important; + width: 65%; + margin-top: 0.3rem; + margin-right: 0px; + } + + .text_head { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.1rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_row2 { + float: left; + border-width: 0.01rem; + width: 100%; + margin-bottom: 0.1rem; + + z-index: 10; + min-height: 30rem; + } + + .div_row_haut { + float: left; + width: 100%; + background-color: #3b3e40; + z-index: 10; + } + + .div_row_bas { + float: right; + width: 100%; + min-height: 100%; + height: 30rem; + + background-color: #e7f3fb; + z-index: 10; + background: url("../../mysy_img/mysy_home.jpg") no-repeat; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + } + + .div_mobile { + z-index: -1; + width: 100%; + height: 100%; + } + + .pieddepage { + z-index: 50; + width: 100%; + float: left; + color: white !important; + } + + .menuPrincipal_bton { + margin-left: 0.9rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + } + + .menuPrincipal { + margin-left: 0.7rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + padding-top: 0.2rem; + } + + .menuPrincipal:hover { + color: #81bc3a; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.1rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; + } + + .div_001 { + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_002 { + float: left; + width: 40%; + text-align: left; + } + + .div_003 { + float: left; + width: 60%; + text-align: right; + color: white; + } + + .div_004 { + color: white; + width: 100%; + height: 0.1rem; + opacity: 100%; + margin-left: auto; + margin-right: auto; + float: left; + margin: 0.2rem; + } + + .div_005 { + width: 100%; + float: left; + } + + .hilightsoustitre { + background: #113459; + color: #fff; + display: block; + font-size: 0.85rem; + margin-bottom: 0.5rem; + letter-spacing: 0.15rem; + } + + .hilightsoustitre_v2 { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + height: 2rem; + padding-top: 5px; + } + + .hilightsoustitre_v2_metier { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + margin-top: 3rem; + height: 2rem; + padding-top: 5px; + } + + .tab_gauche { + width: 50%; + float: left; + text-align: left; + } + + .tab_droite { + width: 50%; + float: right; + text-align: right; + } + + .tab_gauche_metier { + width: 48%; + float: left; + text-align: left; + text-align: left; + margin-right: 2%; + max-width: 48% !important; + min-width: 48% !important; + } + + .tab_droite_metier { + width: 48%; + float: right; + text-align: right; + } + + .img_thematique_metier { + display: block; + border-radius: 10rem; + max-width: 360px; + } + + .met_polaroid_gauche { + width: 95%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_gauche:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_polaroid_droite { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_droite:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_container { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + font-weight: bold; + } + + .met_text { + margin-bottom: 0.1rem; + font-size: x-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + font-weight: bold; + } + + .met_text_larg { + margin-bottom: 0.1rem; + font-size: xx-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + } + + .met_text_all_categories { + margin-bottom: 0.1rem; + font-size: x-small; + margin-top: 1rem; + } + + .met_container_all_categories { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + height: 4rem; + } + + .met_polaroid_gauche_all_categories { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .tab_gauche_all_categories { + width: 100%; + float: left; + text-align: left; + } + + .img_categorie { + width: 100%; + border-top-right-radius: 12px; + border-radius: 12px; + padding: 5px; + } + + .h1_transparent { + color: transparent; + font-size: 0.1rem; + } + + .mymenu_item { + font-size: 0.7rem !important; + } + + .MuiMenuItem-root { + font-size: 0.7rem !important; + } + + .new_filter_zone { + float: left; + width: 35%; + display: flex; + align-items: center; + font-size: 0.75rem; + line-height: 1.5; + color: #212529; + text-align: center; + white-space: nowrap; + background-color: #e9ecef; + border: 1px solid #ced4da; + } + + .new_filter_zone_cerif_radio { + width: 30%; + float: left; + text-align: right; + font-size: 0.75rem; + } + + .new_filter_zone_cerif_radio_right { + float: left; + text-align: left; + font-size: 0.7rem; + padding-left: 5px; + } + + .new_filter_zone_cerif_radio_left { + float: left; + text-align: center; + font-size: 0.7rem; + padding-right: 5px; + padding-left: 2px; + } + + .new_filter_zone_row { + width: 100%; + padding-right: 2px; + } + + .tick_ok_ko { + max-width: 50%; + + } + + .new_filter_zone_prix { + margin-top: 0.8rem; + margin-bottom: 0.8rem; + padding-right: 10px; + } + + .middle { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + + margin-left: auto; + margin-right: auto; + padding-top: 15%; + } + + input::placeholder { + color: white; + } + + .bienvenu { + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: large; + color: white; + } + + .categorie { + padding-top: 15%; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .met_polaroid { + text-align: center; + margin-top: 9rem; + } + + .met_polaroid_line2 { + text-align: center; + margin-top: 1rem; + } + + .img_categorie_v2 { + border-radius: 5px; + background: white; + min-width: 3rem; + width: 6rem; + font-size: smaller; + border: 3px solid black; + box-shadow: 7px 6px 28px 1px rgba(0, 0, 0, 0.24); + cursor: pointer; + outline: none; + transition: 0.2s all; + margin-right: 1rem; + } + + .img_categorie_v2:active { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + .img_categorie_v2:hover { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + input:-webkit-autofill, + input:-webkit-autofill:hover, + input:-webkit-autofill:focus, + input:-webkit-autofill:active { + transition: background-color 5000000s ease-in-out 0s; + } + + .calage { + display: none; + } + + .tab_logo_metier { + width: 100%; + padding-left: 3%; + box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + padding-left: 5px; + border-radius: 10px; + float: left; + padding-bottom: 0.5rem; + padding-top: 5px; + } + + + .tab_critere_espace { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 3px; + gap: 10px; + + width: 100%; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + padding-left: 2rem; + } + + .block_nos_service { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 10px; + position: absolute; + width: 96%; + height: 204px; + left: 2%; + top: 500px; + + } + + .block_nos_formation { + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + + width: 96%; + left: 2%; + top: 500px; + } + + .logo { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + position: absolute; + width: 108px; + height: 52px; + left: 20px; + top: 52px; + } + + .Menu_Header { + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 0px; + gap: 3px; + + position: absolute; + height: 56px; + right: 5px; + top: 50px; + } + + .Header_Content { + width: 100%; + float: left; + width: 95%; + height: 300px; + left: 2.5%; + } + + .Background_Header { + position: absolute; + width: 100%; + height: 300px; + left: 0px; + + + /* Beige */ + + background: #f3f4fb; + z-index: -1; + + } + + .Logo_MySy { + width: 108px; + height: 36px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .training { + + width: 108px; + height: 12px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 900; + font-size: 10px; + line-height: 12px; + /* identical to box height */ + + letter-spacing: 0.83em; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .header_menu { + /* Les formations */ + + cursor: pointer; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .bar_vert { + + width: 1px; + height: 24px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 10px; + + /* Inside auto layout */ + + flex: none; + order: 4; + flex-grow: 0; + } + + .cta1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 5px; + + width: 258px; + height: 56px; + + + /* Inside auto layout */ + + flex: none; + order: 6; + flex-grow: 0; + + } + + .cta2 { + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px; + gap: 10px; + + width: 116px; + height: 56px; + + /* Deep Blue */ + + border: 1px solid #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .cta3 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px; + gap: 10px; + + width: 114px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + } + + + .minscrire { + cursor: pointer; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + font-weight: normal; + font-size: 12px; + + } + + .meconnecter { + cursor: pointer; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + font-weight: normal; + font-size: 12px; + } + + .rectangle_8 { + /* Rectangle 8 */ + + + position: absolute; + width: 50%; + height: 350px; + right: 2rem; + top: 0px; + + background: url("../../mysy_img2/img_header.png") no-repeat; + filter: drop-shadow(0px 8px 14px rgba(0, 0, 0, 0.05)); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + z-index: 0; + } + + .content_search_bar { + margin-top: 3rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .title_desc_header { + width: 100%; + float: left; + height: 150px; + } + + .title1 { + width: 100%; + text-align: center; + height: 120px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 54px; + letter-spacing: 1px; + color: #0A043C; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + } + + .title2 { + width: 90%; + text-align: left; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + + .search_bar_h { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 10px; + + width: 100%; + height: 113px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 12px 0px 24px; + gap: 72px; + + width: 100%; + height: 60px; + + /* White */ + + background: #FFFFFF; + box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.08); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + border: 1px solid #E2E9FB; + border-radius: 60px; + + } + + .frame_153 { + /* Frame 153 */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px 27px; + gap: 10px; + + width: 588px; + height: 17px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_153_txt { + width: 534px; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + display: flex; + align-items: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .input_search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 10px; + + width: 100%; + height: 80px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .cta_recherche { + cursor: pointer; + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 142px; + height: 56px; + + /* Green */ + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .cta_recherche_txt { + width: 90px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 17px; + line-height: 30px; + /* identical to box height, or 176% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .search_dropdown { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 28%; + + } + + .search_bar_rectangle { + width: 1px; + height: 60px; + + background: rgba(0, 0, 0, 0.08); + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_text { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 70%; + height: 32px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .nos_serv_background { + position: absolute; + width: 1440px; + height: 436px; + left: 0px; + top: 452px; + + /* White */ + + background: #FFFFFF; + } + + .nos_serv_txt { + width: 100%; + height: 28px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 28px; + line-height: 38px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .nos_serv_list { + display: flex; + flex-direction: row; + justify-content: start; + align-items: center; + padding: 0px; + gap: 15px; + + width: 100%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 31%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .nos_serv_serv2 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 28%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv3 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 28%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .block_filter { + /* Block Filters */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 24px; + + width: 309px; + height: 1110px; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_formation { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 947px; + height: 2486px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + margin-bottom: 3rem; + } + + .sous_filter_metier { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 100%; + } + + .sous_filter_txt { + /* Les filtres */ + + + height: 24px; + letter-spacing: 1px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 18px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_separator { + width: 277px; + height: 0px; + + opacity: 0.08; + /* Deep Blue */ + + border: 1px solid #0A043C; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 12px; + + width: 277px; + height: 494px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_mertier { + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 277px; + height: 496px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .filter_valeur { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 71px; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .filter_valeur_txt { + /* Eligible CPF */ + + letter-spacing: 2px; + height: 19px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 19px; + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .filter_valeur_block_val { + /* List Checkbox */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 90%; + height: 48px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_133 { + /* Frame 133 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 1; + } + + .frame_133_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 50px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_radio { + /* Radio Button */ + + cursor: pointer; + + width: 16px; + height: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_txt { + /* Oui */ + + + width: 26px; + height: 22px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .frame_134 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_134_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 55px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .frame_135 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 20px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_135_grp { + /* Checbox + Text */ + + margin-left: 10px; + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 30px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + + .filter_txt { + /* Les filtres */ + + + width: 92px; + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block { + /* Filter */ + + cursor: pointer; + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 10px; + gap: 10px; + + width: 95%; + height: 70px; + + /* White */ + + background: #FFFFFF; + border: 1px solid #DFDFDF; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + + } + + .filter_metier_sous_block_content { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 12px; + + width: 180px; + height: 40px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_radio { + + /* Radio Button */ + + + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_txt { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 144px; + height: 40px; + + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_formation { + width: 144px; + height: 22px; + margin-top: 10px; + text-align: left; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_nb { + width: 85px; + height: 14px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 14px; + + /* Deep Blue */ + + color: #0A043C; + + opacity: 0.7; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .filter_metier_sous_block_plus_metier { + /* Icon + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 233px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_1 { + border: #0A043C solid; + width: 24px; + height: 24px; + + cursor: pointer; + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_2 { + width: 201px; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 15px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .block_actualite { + /* Actualité */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + position: absolute; + width: 100%; + height: 549px; + top: 4550px; + display: none; + } + + .block_actualite_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 100%; + height: 453px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_actualite_sous_block_text { + width: 261px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 30px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 90%; + height: 365px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + + } + + .block_list_actu_actu1 { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 23px; + + width: 32%; + height: 364px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_img { + width: 100%; + height: 250px; + + background: url(https://img.mysy-training.com/img_actu1.png), #D9D9D9 no-repeat; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text { + /* Date + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px 0px 0px 8px; + gap: 8px; + + height: 91px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_date { + width: 152px; + height: 19px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 19px; + text-transform: uppercase; + + /* Blue */ + + color: #3E6EE3; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_txt { + + height: 64px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: medium; + line-height: 32px; + /* or 133% */ + + letter-spacing: -0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .pieddepage_v2 { + position: relative; + width: 100%; + + left: 0px; + + top: 6000px; + background: #FFF5DA; + z-index: -1; + } + + .bton_tout_nos_article { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .bton_tout_nos_article_account_box { + display: none; + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .bton_tout_nos_article_txt { + + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 20px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_partner { + /* Partner Block */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 40px; + gap: 10px; + + position: absolute; + width: 95%; + height: 386px; + top: 4750px; + + /* White */ + + background: #FFFFFF; + /* Shadow 01 */ + + box-shadow: 0px 54px 100px rgba(10, 4, 60, 0.08); + border-radius: 8px; + + } + + .block_partner_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 24px; + + width: 100%; + height: 306px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 16px; + + width: 100%; + height: 226px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_logo { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 4px; + + width: 160px; + height: 76px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_desc { + width: 600px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 25px; + line-height: 28px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_txt { + width: 100%; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_buton { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Green */ + + background: #20BFA9; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .logo_not_absolut { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .block_partner_sous_block_logo_desc_desc2 { + width: 100%; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .domaine_icone { + margin-top: 5px; + width: 10%; + } + + .domaine_icone_fa { + margin-top: 5px; + width: 5%; + cursor: pointer; + } + + + .fron_search { + border: none; + font-size: medium; + padding-right: 5px; + } + + .service1_img { + left: 0px; + top: 0px; + + background: #D6EBE4; + opacity: 1; + border-radius: 1rem; + margin-top: 1rem; + display: none; + } + + .service1_title_desc { + /* Title + Description */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .service1_title { + + width: 100%; + text-align: left; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + /* identical to box height, or 133% */ + + letter-spacing: 0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .service1_desc { + text-align: left; + height: 80px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 20px; + width: 100%; + /* or 143% */ + + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .img_service { + width: 100%; + height: 4rem; + border-radius: 1rem; + } + + .forma_et_tuto { + width: 99%; + margin-left: 5px; + height: 80px; + padding-top: 10px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + background: #F7F7F7; + } + + .forma_et_tuto_mobile { + display: none; + } + + .cta_publication { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px 2px; + gap: 5px; + + width: 120px; + height: 56px; + + /* Deep Blue */ + + background: red; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 12px; + } + + .cta_publication_v2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px 2px; + gap: 5px; + + width: 120px; + height: 56px; + + /* Deep Blue */ + + background: #53B7EB; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 12px; + font-weight: 600; + + text-decoration: none; + -webkit-animation: glowing 1500ms 4; + -moz-animation: glowing 1500ms 4; + -o-animation: glowing 1500ms 4; + animation: glowing 1500ms 4; + + } + + @-webkit-keyframes glowing { + 0% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + } + + @-moz-keyframes glowing { + 0% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + } + + @-o-keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + @keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + + .cta_hebergement { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px 2px; + gap: 5px; + + width: 120px; + height: 56px; + + /* Deep Blue */ + + background: rebeccapurple; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 12px; + } + + .search_bar_2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 5px 0px 5px; + gap: 1px; + + width: 100%; + height: 10px; + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + margin-bottom: 2rem !important; + text-align: left; + padding-left: 1rem; + + } + + .bton_ensavoir_plus { + border-radius: 5rem; + font-size: medium; + background: #81BC3A !important; + text-align: center; + height: 2.5rem; + width: 100%; + color: white; + margin-left: 10px; + margin-right: 10px; + padding-top: 10px; + cursor: pointer; + } + + .block_newletter { + font-size: 18px; + font-weight: 400; + width: 100%; + line-height: 15px; + margin-top: 20px; + } + + .block_newletter_email { + width: 80%; + float: left; + + } + + .block_newletter_bton_ok { + width: 20%; + float: left; + margin-top: 10px; + position: relative; + left: -5px; + } + + .block_newletter_bton_bton_ok { + height: 3rem; + border: solid 1px black; + background: #0A043C; + color: white; + width: 80%; + + } + + + .cta_recherche_img_search_loup { + width: 50%; + margin-right: -28px; + } + + + .block_formation { + flex: 1 1 200px; + display: flex; + flex-direction: column; + gap: 40px; + + background-color: rgba(253, 246, 236, 0.1); + border-radius: 12px; + border: 1px solid #ecae49; + max-width: 400px; + box-sizing: border-box; + flex-grow: 1; + background: #FFF; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; + display: flex; + flex-direction: column; + border: 1px solid #E2E9FB + } + + .block_display_flex_formation { + display: flex; + flex-direction: row; + gap: 15px; + width: 100%; + flex-wrap: wrap; + justify-content: left; + } + + + } + + @media only screen and (min-width: 992px) and (max-width: 1199px) { + /*style grande tablettes & Pc portable */ + + .block_pagination { + width: 50%; + float: left; + + } + + .block_trier_par { + width: 40%; + float: right; + } + + .div_row { + float: left; + border-width: 0.01rem; + width: 100%; + margin-bottom: 1rem; + border-radius: 1rem; + } + + .div_row_gauche { + float: left; + + border-width: 0.01rem; + width: 48%; + border-radius: 1rem; + } + + .div_row_droite { + float: right; + border-width: 0.01rem; + width: 48%; + border-radius: 1rem; + } + + .align_gauche { + margin-left: 0rem; + width: 100%; + float: right; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + } + + .recherchefilter { + display: none; + } + + .okUpdateData { + font-size: small; + color: green; + font-style: italic; + } + + .koUpdateData { + font-size: small; + color: red; + font-style: italic; + } + + .rech_container { + width: 90%; + height: 200px; + background: aqua; + margin: auto; + padding: 10px; + border-radius: 30px; + } + + .rech_leftbox { + float: left; + border-width: 1px; + width: 100%; + + padding: 0.1rem; + border-radius: 1rem; + margin-bottom: 0.1rem; + font-family: "verdana", "Quicksand", "Signika", sans-serif !important; + background: white; + margin-left: 5px; + margin-top: 0.5rem; + padding-left: 5px; + height: auto; + } + + .rech_middlebox { + float: left; + border-width: 2px; + width: 64%; + height: 100%; + margin: auto; + padding: 0rem; + border-radius: 30px; + margin-right: 0%; + padding-left: 1rem; + padding-right: 10px; + } + + .rech_rightbox { + + display: none; + } + + .rech_rightbox .button2 { + opacity: 1; + background: #619e31; + border: 1px; + outline: 0; + border-bottom: 2px solid transparent; + color: white; + font-size: medium !important; + border-radius: 1rem; + margin: 0px; + padding: 0px; + text-align: center; + margin-bottom: 0.5rem; + } + + .rech_rightbox_inside { + float: left; + width: 100%; + height: 100%; + margin: auto; + padding: 0px; + border-radius: 0px; + margin-right: 0%; + overflow-y: scroll; + height: 800px; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: medium; + padding-right: 5px; + margin-right: 5px; + } + + .textsurimage { + color: rgb(218, 207, 207); + background-color: transparent; + font-size: 40pt; + text-align: center; + position: absolute; + top: 30%; + left: 50%; + transform: translate(-50%, -50%); + position: absolute; + } + + .rech_list_formation2 { + display: inline-block; + width: 100%; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + margin: 0; + text-align: left; + border-radius: 10px; + margin-bottom: 10px; + background-color: white; + + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + } + + .rech_list_formation2:hover { + -webkit-box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + } + + .textsurimage23 { + color: rgb(218, 207, 207); + background-color: transparent; + text-align: center; + position: absolute; + top: 20%; + left: 30%; + width: 30rem; + } + + .form-input { + border-radius: 10rem; + height: 2.8rem; + font-size: medium; + line-height: 1.5; + margin-bottom: 4px; + color: white; + border: 2px solid white; + background: transparent; + box-shadow: none; + } + + h4 { + display: inline-block; + font-size: x-large; + /*or whatever you want*/ + color: white; + } + + .default_font { + color: #3c4043; + display: inline-block; + line-height: 28px; + font-size: medium; + } + + .form { + font-size: medium; + width: 100%; + margin-left: auto; + margin-right: auto; + margin-bottom: 0.5rem; + position: relative; + margin-top: 1rem; + z-index: 11; + display: flex; + } + + .form span { + position: absolute; + right: 0.2rem; + top: 0.1rem; + padding: 2px; + border-left: 0.2rem solid white; + height: 2.7rem; + } + + form svg { + margin-top: 0.8rem !important; + cursor: pointer; + } + + .form span_clear { + position: absolute; + right: 1.5rem !important; + top: 0.1rem !important; + padding: 2px; + border-left: 0.2rem solid white !important; + height: 2.7rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + .left-pan { + padding-left: 7px; + } + + .left-pan i { + padding-left: 10px; + } + + .containerBox { + position: relative; + display: inline-block; + margin-top: 0.5rem; + } + + .text-box { + position: absolute; + height: 100%; + text-align: center; + width: 100%; + } + + .text-box:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + } + + .img_logo { + display: block; + height: auto; + margin-left: 0px; + margin-right: auto; + max-width: 20%; + max-height: 3rem; + } + + + .form-select { + height: 2.5rem !important; + border-radius: 0px; + font-size: small; + } + + + .mb-3 { + margin-bottom: 0.5rem !important; + font-size: small !important; + cursor: pointer; + } + + .input-group-text { + font-size: 0.8rem !important; + padding-left: 0px !important; + } + + .filter_span { + padding-top: 0.5rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + color: #107758; + font-size: 0.9rem; + white-space: nowrap; + width: 20%; + padding-top: 10px; + + } + + .filter_val { + padding-top: 0.1rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + font-size: 0.75rem; + white-space: nowrap; + border: none; + background: transparent; + color: #3b3e40; + font-family: "DM Sans", "verdana", "Quicksand", "Signika"; + border: 1px solid #C7C9CE; + border-radius: 0.3rem !important; + width: 65%; + margin-top: 0.3rem; + margin-right: 0px; + } + + .text_head { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.1rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_row2 { + float: left; + border-width: 0.01rem; + width: 100%; + margin-bottom: 0.1rem; + + z-index: 10; + min-height: 30rem; + } + + .div_row_haut { + float: left; + + width: 100%; + background-color: #3b3e40; + z-index: 10; + } + + .div_row_bas { + float: right; + width: 100%; + min-height: 100%; + height: 30rem; + + background-color: #e7f3fb; + z-index: 10; + background: url("../../mysy_img/mysy_home.jpg") no-repeat; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + + } + + .div_mobile { + z-index: -1; + width: 100%; + height: 100%; + } + + .pieddepage { + z-index: 50; + width: 100%; + float: left; + color: white !important; + margin-top: 5rem; + } + + .menuPrincipal_bton { + margin-left: 0.9rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + } + + .menuPrincipal { + margin-left: 0.8rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + padding-top: 0.2rem; + } + + .menuPrincipal:hover { + color: #81bc3a; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.1rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; + } + + .div_001 { + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_002 { + float: left; + width: 50%; + text-align: left; + } + + .div_003 { + float: left; + width: 50%; + text-align: right; + color: white; + } + + .div_004 { + color: white; + width: 100%; + height: 0.1rem; + opacity: 100%; + margin-left: auto; + margin-right: auto; + float: left; + margin: 0.2rem; + } + + .div_005 { + width: 100%; + float: left; + } + + .hilightsoustitre { + background: #113459; + color: #fff; + display: block; + font-size: 0.9rem; + margin-bottom: 0.5rem; + letter-spacing: 0.15rem; + } + + .hilightsoustitre_v2 { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + margin-top: 0.5rem; + letter-spacing: 2px; + height: 2rem; + padding-top: 5px; + } + + .hilightsoustitre_v2_metier { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + margin-top: 3rem; + height: 2rem; + padding-top: 5px; + } + + .tab_gauche { + width: 50%; + float: left; + text-align: left; + } + + .tab_droite { + width: 50%; + float: right; + text-align: right; + } + + .tab_gauche_metier { + width: 48%; + float: left; + text-align: left; + } + + .tab_droite_metier { + width: 48%; + float: right; + text-align: right; + } + + .img_thematique_metier { + display: block; + border-radius: 10rem; + max-width: 360px; + } + + .met_polaroid_gauche { + width: 95%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_gauche:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_polaroid_droite { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_droite:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_container { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + font-weight: bold; + } + + .met_text { + margin-bottom: 0.1rem; + font-size: small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + font-weight: bold; + } + + .met_text_larg { + margin-bottom: 0.1rem; + font-size: xx-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + } + + .met_text_all_categories { + margin-bottom: 0.1rem; + font-size: x-small; + margin-top: 1rem; + } + + .met_container_all_categories { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + height: 3rem; + } + + .met_polaroid_gauche_all_categories { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .tab_gauche_all_categories { + width: 100%; + float: left; + text-align: left; + } + + .img_categorie { + width: 100%; + border-top-right-radius: 12px; + border-radius: 12px; + padding: 5px; + } + + .h1_transparent { + color: transparent; + font-size: 0.1rem; + } + + .mymenu_item { + font-size: 0.7rem !important; + } + + .MuiMenuItem-root { + font-size: 0.7rem !important; + } + + .new_filter_zone { + float: left; + width: 35%; + display: flex; + align-items: center; + font-size: small; + line-height: 1.5; + color: #212529; + text-align: center; + white-space: nowrap; + background-color: #e9ecef; + border: 1px solid #ced4da; + } + + .new_filter_zone_cerif_radio { + width: 30%; + float: left; + text-align: right; + font-size: smaller; + } + + .new_filter_zone_cerif_radio_right { + float: left; + text-align: left; + font-size: small; + padding-left: 5px; + } + + .new_filter_zone_cerif_radio_left { + float: left; + text-align: center; + font-size: small; + padding-right: 5px; + padding-left: 2px; + } + + .new_filter_zone_row { + width: 100%; + padding-right: 5px; + } + + .tick_ok_ko { + max-width: 50%; + } + + .new_filter_zone_prix { + margin-top: 0.7rem; + margin-bottom: 0.7rem; + padding-right: 10px; + } + + .middle { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + + margin-left: auto; + margin-right: auto; + padding-top: 15%; + } + + input::placeholder { + color: white; + } + + .bienvenu { + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: large; + color: white; + } + + .categorie { + padding-top: 15%; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .met_polaroid { + text-align: center; + margin-top: 9rem; + } + + .met_polaroid_line2 { + text-align: center; + margin-top: 1rem; + } + + .img_categorie_v2 { + border-radius: 5px; + background: white; + min-width: 3rem; + width: 8rem; + font-size: smaller; + border: 2px solid black; + box-shadow: 7px 6px 28px 1px rgba(0, 0, 0, 0.24); + cursor: pointer; + outline: none; + transition: 0.2s all; + margin-right: 1rem; + } + + .img_categorie_v2:active { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + .img_categorie_v2:hover { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + input:-webkit-autofill, + input:-webkit-autofill:hover, + input:-webkit-autofill:focus, + input:-webkit-autofill:active { + transition: background-color 5000000s ease-in-out 0s; + } + + .calage { + display: none; + } + + .tab_logo_metier { + width: 100%; + padding-left: 5px; + box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + padding-left: 10px; + border-radius: 10px; + float: left; + padding-bottom: 0.5rem; + padding-top: 10px; + } + + + .tab_critere_espace { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 10px; + + width: 100%; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_nos_service { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 10px; + + position: absolute; + width: 97%; + height: 204px; + left: 20px; + top: 510px; + background: white; + + } + + .block_nos_formation { + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + + width: 96%; + left: 2%; + top: 500px; + } + + .logo { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + position: absolute; + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .Menu_Header { + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 0px; + gap: 10px; + + position: absolute; + width: 843px; + height: 56px; + right: 5px; + top: 50px; + } + + .Header_Content { + /* Auto layout * / + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + isolation: isolate; + + position: absolute; + width: 95%; + height: 367px; + left: 5%; + top: 136px;*/ + + width: 100%; + float: left; + width: 95%; + height: 300px; + left: 2.5%; + } + + + .Background_Header { + position: absolute; + width: 100%; + height: 300px; + left: 0px; + + + /* Beige */ + + background: #f3f4fb; + z-index: -1; + + } + + + .Logo_MySy { + width: 108px; + height: 36px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .training { + + width: 108px; + height: 12px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 900; + font-size: 10px; + line-height: 12px; + /* identical to box height */ + + letter-spacing: 0.83em; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .header_menu { + /* Les formations */ + cursor: pointer; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .bar_vert { + + width: 1px; + height: 24px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 10px; + + /* Inside auto layout */ + + flex: none; + order: 4; + flex-grow: 0; + } + + .cta1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 288px; + height: 56px; + + + /* Inside auto layout */ + + flex: none; + order: 6; + flex-grow: 0; + + } + + .cta2 { + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 126px; + height: 56px; + + /* Deep Blue */ + + border: 1px solid #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .cta3 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + } + + + .minscrire { + cursor: pointer; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .meconnecter { + cursor: pointer; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .rectangle_8 { + /* Rectangle 8 */ + + + position: absolute; + width: 500px; + height: 400px; + right: 1rem; + top: 0px; + + background: url("../../mysy_img2/img_header.png") no-repeat; + filter: drop-shadow(0px 8px 14px rgba(0, 0, 0, 0.05)); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + z-index: 0; + } + + .content_search_bar { + + height: 367px; + margin-top: 4rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .title_desc_header { + width: 100%; + float: left; + height: 150px; + } + + .title1 { + width: 100%; + text-align: center; + height: 120px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 54px; + letter-spacing: 1px; + color: #0A043C; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + } + + .title2 { + width: 90%; + text-align: left; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .search_bar_h { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 10px; + + width: 100%; + height: 113px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 12px 0px 24px; + gap: 72px; + + width: 100%; + height: 60px; + + /* White */ + + background: #FFFFFF; + box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.08); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + border: 1px solid #E2E9FB; + border-radius: 60px; + + } + + .frame_153_txt { + width: 50%; + height: 17px; + text-align: left; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + display: flex; + align-items: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .input_search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 5px; + + width: 80%; + height: 80px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .cta_recherche { + cursor: pointer; + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 142px; + height: 56px; + + /* Green */ + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .cta_recherche_txt { + width: 90px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 17px; + line-height: 30px; + /* identical to box height, or 176% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .search_dropdown { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 2px; + + + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 30%; + + } + + .search_bar_rectangle { + width: 1px; + height: 60px; + + background: rgba(0, 0, 0, 0.08); + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_text { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 93%; + height: 32px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .nos_serv_background { + position: absolute; + width: 1440px; + height: 436px; + left: 0px; + top: 452px; + + /* White */ + + background: #FFFFFF; + } + + .nos_serv_txt { + width: 227px; + height: 28px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 30px; + line-height: 38px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .nos_serv_list { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 56px; + + width: 95%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .nos_serv_serv2 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv3 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .block_filter { + /* Block Filters */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 24px; + + width: 309px; + height: 1110px; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_formation { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 947px; + height: 2486px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + margin-bottom: 3rem; + } + + .sous_filter_metier { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 100%; + } + + .sous_filter_txt { + /* Les filtres */ + + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_separator { + width: 277px; + height: 0px; + + opacity: 0.08; + /* Deep Blue */ + + border: 1px solid #0A043C; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 12px; + + width: 277px; + height: 494px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_mertier { + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 277px; + height: 496px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .filter_valeur { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 71px; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .filter_valeur_txt { + /* Eligible CPF */ + + letter-spacing: 2px; + height: 19px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 19px; + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .filter_valeur_block_val { + /* List Checkbox */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 100%; + height: 48px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_133 { + /* Frame 133 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 1; + } + + .frame_133_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 50px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_radio { + /* Radio Button */ + + cursor: pointer; + width: 16px; + height: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_txt { + /* Oui */ + + + width: 26px; + height: 22px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .frame_134 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_134_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 55px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .frame_135 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 50px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_135_grp { + /* Checbox + Text */ + + margin-left: 10px; + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 30px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + + .filter_txt { + /* Les filtres */ + + + width: 92px; + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block { + /* Filter */ + + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 16px; + gap: 10px; + + width: 90%; + height: 72px; + + /* White */ + + background: #FFFFFF; + border: 1px solid #DFDFDF; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + + } + + .filter_metier_sous_block_content { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 12px; + + width: 180px; + height: 40px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_radio { + + /* Radio Button */ + + + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_txt { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 144px; + height: 40px; + + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_formation { + width: 144px; + height: 22px; + + text-align: left; + margin-top: 10px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_nb { + width: 85px; + height: 14px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 14px; + + /* Deep Blue */ + + color: #0A043C; + + opacity: 0.7; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .filter_metier_sous_block_plus_metier { + /* Icon + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 233px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_1 { + border: #0A043C solid; + width: 24px; + height: 24px; + + cursor: pointer; + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_2 { + width: 201px; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .block_actualite { + /* Actualité */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + position: absolute; + width: 100%; + height: 549px; + + top: 4450px; + display: none; + } + + .block_actualite_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 100%; + height: 453px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_actualite_sous_block_text { + width: 261px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 95%; + height: 365px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + + } + + .block_list_actu_actu1 { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 23px; + + width: 32%; + height: 364px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_img { + width: 100%; + height: 250px; + + background: url(https://img.mysy-training.com/img_actu1.png), #D9D9D9 no-repeat; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_actu_actu1_date_text { + /* Date + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px 0px 0px 8px; + gap: 8px; + + + height: 91px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_date { + width: 152px; + height: 19px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 19px; + text-transform: uppercase; + + /* Blue */ + + color: #3E6EE3; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_txt { + + height: 64px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: medium; + line-height: 32px; + /* or 133% */ + + letter-spacing: -0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .pieddepage_v2 { + position: relative; + width: 100%; + + left: 0px; + + top: 5850px; + background: #FFF5DA; + z-index: -1; + + } + + .bton_tout_nos_article { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .bton_tout_nos_article_account_box { + display: none; + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .bton_tout_nos_article_txt { + + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_partner { + /* Partner Block */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 40px; + gap: 10px; + + position: absolute; + width: 90%; + height: 386px; + left: 72px; + top: 4650px; + + /* White */ + + background: #FFFFFF; + /* Shadow 01 */ + + box-shadow: 0px 54px 100px rgba(10, 4, 60, 0.08); + border-radius: 8px; + + } + + .block_partner_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 24px; + + width: 858px; + height: 306px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 16px; + + width: 858px; + height: 226px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_logo { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 4px; + + width: 160px; + height: 76px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_desc { + width: 600px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 25px; + line-height: 28px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_txt { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_buton { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Green */ + + background: #20BFA9; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .logo_not_absolut { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .block_partner_sous_block_logo_desc_desc2 { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .domaine_icone { + margin-top: 5px; + } + + .domaine_icone_fa { + margin-top: 5px; + margin-right: 5px; + cursor: pointer; + } + + .fron_search { + border: none; + font-size: medium; + padding-right: 5px; + } + + .service1_img { + left: 0px; + top: 0px; + + background: #D6EBE4; + opacity: 1; + border-radius: 1rem; + margin-top: 1rem; + } + + .service1_title_desc { + /* Title + Description */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 60%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .service1_title { + + width: 100%; + height: 62px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 18px; + line-height: 25px; + /* identical to box height, or 133% */ + + letter-spacing: 0.3px; + text-align: left; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .service1_desc { + text-align: left; + height: 80px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 20px; + /* or 143% */ + + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .img_service { + width: 100%; + height: 4rem; + border-radius: 1rem; + } + + .forma_et_tuto { + width: 99%; + margin-left: 5px; + height: 80px; + padding-top: 10px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + background: #F7F7F7; + } + + .forma_et_tuto_mobile { + display: none; + } + + .cta_publication { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px 2px; + gap: 10px; + + width: 130px; + height: 56px; + + /* Deep Blue */ + + background: red; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-size: 12px; + font-weight: 600; + } + + + .cta_publication_v2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 2px 2px; + gap: 10px; + + width: 130px; + height: 56px; + + /* Deep Blue */ + + background: #53B7EB; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-size: 12px; + font-weight: 600; + + text-decoration: none; + -webkit-animation: glowing 1500ms 4; + -moz-animation: glowing 1500ms 4; + -o-animation: glowing 1500ms 4; + animation: glowing 1500ms 4; + + } + + @-webkit-keyframes glowing { + 0% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + } + + @-moz-keyframes glowing { + 0% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + } + + @-o-keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + @keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + + + .cta_hebergement { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 130px; + height: 56px; + + /* Deep Blue */ + + background: rebeccapurple; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-size: 12px; + font-weight: 600; + } + + .search_bar_2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 2px 0px 4px; + gap: 1px; + + width: 100%; + height: 10px; + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + margin-bottom: 2rem !important; + text-align: left; + padding-left: 1rem; + + } + + .bton_ensavoir_plus { + border-radius: 5rem; + font-size: medium; + background: #81BC3A !important; + text-align: center; + height: 2.5rem; + width: 90%; + color: white; + margin-left: 10px; + margin-right: 10px; + padding-top: 10px; + cursor: pointer; + } + + .block_newletter { + font-size: 18px; + font-weight: 400; + width: 100%; + line-height: 15px; + margin-top: 20px; + } + + .block_newletter_email { + width: 80%; + float: left; + + } + + .block_newletter_bton_ok { + width: 20%; + float: left; + margin-top: 10px; + position: relative; + left: -5px; + } + + .block_newletter_bton_bton_ok { + height: 3rem; + border: solid 1px black; + background: #0A043C; + color: white; + width: 80%; + + } + + + .cta_recherche_img_search_loup { + width: 50%; + margin-right: -30px; + } + + + .block_formation { + flex: 1 1 200px; + display: flex; + flex-direction: column; + gap: 40px; + + background-color: rgba(253, 246, 236, 0.1); + border-radius: 12px; + border: 1px solid #ecae49; + max-width: 400px; + box-sizing: border-box; + flex-grow: 1; + background: #FFF; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; + display: flex; + flex-direction: column; + border: 1px solid #E2E9FB + } + + .block_display_flex_formation { + display: flex; + flex-direction: row; + gap: 15px; + width: 100%; + flex-wrap: wrap; + justify-content: left; + } + + + } + + @media only screen and (min-width: 1200px) and (max-width: 1919px) { + + .block_pagination { + width: 50%; + float: left; + + } + + .block_trier_par { + width: 40%; + float: right; + } + + /* Ordi de bureau et grands ecrans*/ + .align_gauche { + margin-left: 0rem; + width: 100%; + float: right; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + } + + .recherchefilter { + display: none; + } + + .okUpdateData { + font-size: small; + color: green; + font-style: italic; + } + + .koUpdateData { + font-size: small; + color: red; + font-style: italic; + } + + .rech_container { + width: 90%; + height: 200px; + background: aqua; + margin: auto; + padding: 10px; + border-radius: 30px; + } + + .rech_leftbox { + float: left; + + border-width: 1px; + width: 100%; + padding: 0.5rem; + + margin-bottom: 0.1rem; + font-size: small !important; + font-family: "verdana", "Quicksand", "Signika", sans-serif !important; + background: #FFF; + margin-left: 5px; + + padding-left: 5px; + height: auto; + } + + .rech_middlebox { + float: left; + border-width: 2px; + width: 75%; + height: 100%; + margin: auto; + padding: 0rem; + + margin-right: 0%; + padding-left: 1rem; + padding-right: 10px; + background: #fff; + + } + + .rech_rightbox { + + display: none; + } + + .rech_rightbox .button2 { + opacity: 1; + background: #619e31; + border: 1px; + outline: 0; + border-bottom: 2px solid transparent; + color: white; + font-size: medium !important; + border-radius: 1rem; + margin: 0px; + padding: 0px; + text-align: center; + margin-bottom: 0.5rem; + } + + .rech_rightbox_inside { + float: left; + width: 100%; + height: 100%; + margin: auto; + padding: 0px; + border-radius: 0px; + margin-right: 0%; + overflow-y: scroll; + height: 800px; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + padding-right: 5px; + margin-right: 5px; + } + + .textsurimage { + color: rgb(218, 207, 207); + background-color: transparent; + font-size: 40pt; + text-align: center; + position: absolute; + top: 30%; + left: 50%; + transform: translate(-50%, -50%); + position: absolute; + } + + .rech_list_formation2 { + display: inline-block; + width: 100%; + background-color: white; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + + margin: 0; + text-align: left; + border-radius: 10px; + margin-bottom: 10px; + background-color: white; + + + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + + + } + + .rech_list_formation2:hover { + -webkit-box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + } + + .textsurimage23 { + color: rgb(218, 207, 207); + background-color: transparent; + text-align: center; + position: absolute; + top: 20%; + left: 40%; + } + + h4 { + display: inline-block; + font-size: xx-large; + /*or whatever you want*/ + color: white; + } + + .default_font { + color: #3c4043; + display: inline-block; + line-height: 28px; + font-size: medium; + } + + .form-input { + border-radius: 10rem; + height: 3rem; + font-size: medium; + line-height: 1.5; + margin-bottom: 4px; + color: white; + border: 2.5px solid white; + background: transparent; + box-shadow: none; + } + + .form { + font-size: medium; + width: 100%; + margin-left: auto; + margin-right: auto; + position: relative; + + z-index: 11; + height: 3rem; + display: flex; + } + + .form span { + position: absolute; + right: 0.2rem; + top: 0.1rem; + padding: 2px; + border-left: 0.2rem solid white; + height: 2.9rem; + } + + .form span_clear { + position: absolute; + right: 1.5rem !important; + top: 0.1rem !important; + padding: 2px; + border-left: 0.2rem solid white !important; + height: 2.9rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + form svg { + margin-top: 0.8rem !important; + cursor: pointer; + } + + .left-pan { + padding-left: 7px; + } + + .left-pan i { + padding-left: 10px; + } + + .containerBox { + position: fixed; + margin-top: 0.5rem; + height: 10rem; + border: 0.2rem solid #0d0e10; + width: 100%; + background-color: #999; + } + + .containerBox0 { + float: left; + width: 30%; + } + + .text_head_droite { + color: #3b3e40; + font-family: "lucida", "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + font-weight: bold; + text-align: right; + } + + .text_head_gauche { + color: #3b3e40; + font-family: "lucida", "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + font-weight: bold; + text-align: left; + } + + .text_head { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .text-box { + position: absolute; + height: 100%; + text-align: center; + width: 100%; + } + + .text-box:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + } + + .img_logo { + display: block; + height: auto; + margin-left: 0px; + margin-right: auto; + max-width: 18%; + max-height: 3rem; + } + + .form-select { + height: 2.5rem !important; + border-radius: 0px; + font-size: small; + } + + .mb-3 { + margin-bottom: 0.7rem !important; + font-size: xx-small !important; + cursor: pointer; + } + + .input-group-text { + font-size: x-small !important; + padding-left: 0px !important; + } + + .filter_span { + padding-top: 0.5rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + color: #107758; + font-size: 0.9rem; + white-space: nowrap; + width: 20%; + padding-top: 10px; + + } + + .filter_val { + padding-top: 0.1rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + font-size: 0.9rem; + white-space: nowrap; + border: none; + background: transparent; + color: #3b3e40; + font-family: "DM Sans", "verdana", "Quicksand", "Signika"; + border: 1px solid #C7C9CE; + border-radius: 0.3rem !important; + width: 65%; + margin-top: 0.3rem; + margin-right: 0px; + } + + .div_row2 { + float: left; + + border-width: 0.01rem; + width: 100%; + margin-bottom: 0.1rem; + + + z-index: 10; + + } + + .div_row_haut { + float: left; + + width: 100%; + + background-color: #3b3e40; + z-index: 10; + } + + .div_row_bas { + float: right; + width: 100%; + min-height: 100%; + + + background-color: #e7f3fb; + z-index: 10; + background: url("../../mysy_img/mysy_home.jpg") no-repeat; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + + } + + .div_mobile { + z-index: -1; + width: 100%; + height: 100%; + } + + .pieddepage { + z-index: 50; + width: 100%; + float: left; + color: white !important; + margin-top: 5rem; + } + + .menuPrincipal_bton { + margin-left: 0.9rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + } + + .menuPrincipal { + margin-left: 0.9rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + padding-top: 0.2rem; + } + + .menuPrincipal:hover { + color: #81bc3a; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.1rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; + } + + .div_001 { + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_002 { + float: left; + width: 50%; + text-align: left; + } + + .div_003 { + float: left; + width: 50%; + text-align: right; + color: white; + } + + .div_004 { + color: white; + width: 100%; + height: 0.25rem; + opacity: 100%; + margin-left: auto; + margin-right: auto; + float: left; + margin: 0.2rem; + } + + .div_005 { + width: 100%; + float: left; + } + + .hilightsoustitre { + background: #113459; + color: #fff; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + letter-spacing: 0.2rem; + } + + .hilightsoustitre_v2 { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + height: 2rem; + padding-top: 5px; + } + + .hilightsoustitre_v2_metier { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + margin-top: 4rem; + height: 2rem; + padding-top: 5px; + } + + .tab_gauche { + width: 50%; + float: left; + text-align: left; + } + + .tab_droite { + width: 50%; + float: right; + text-align: right; + } + + .tab_gauche_metier { + width: 30%; + float: left; + text-align: left; + margin-right: 2%; + max-width: 30% !important; + min-width: 30% !important; + } + + .tab_droite_metier { + width: 50%; + float: right; + text-align: right; + } + + .img_thematique_metier { + display: block; + border-radius: 10rem; + max-width: 360px; + } + + .met_polaroid_gauche { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_gauche:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_polaroid_droite { + width: 97%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + margin-left: 3%; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_droite:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_container { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + font-weight: bold; + } + + .met_text { + margin-bottom: 0.1rem; + font-size: small; + font-weight: normal; + white-space: nowrap; + overflow: hidden; + letter-spacing: 1px; + } + + .met_text_larg { + margin-bottom: 0.1rem; + font-size: xx-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + } + + .met_text_all_categories { + margin-bottom: 0.1rem; + font-size: x-small; + margin-top: 1rem; + } + + .met_container_all_categories { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + height: 3rem; + } + + .met_polaroid_gauche_all_categories { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .tab_gauche_all_categories { + width: 100%; + float: left; + text-align: left; + } + + .img_categorie { + width: 100%; + border-top-right-radius: 12px; + border-radius: 12px; + padding: 5px; + } + + .h1_transparent { + color: transparent; + font-size: 0.1rem; + } + + .mymenu_item { + font-size: 0.8rem !important; + } + + .MuiMenuItem-root { + font-size: 0.8rem !important; + } + + .new_filter_zone { + float: left; + width: 35%; + display: flex; + align-items: center; + font-size: small; + line-height: 1.5; + color: #212529; + text-align: center; + white-space: nowrap; + background-color: #e9ecef; + border: 1px solid #ced4da; + } + + .new_filter_zone_cerif_radio { + width: 30%; + float: left; + text-align: right; + font-size: smaller; + } + + .new_filter_zone_cerif_radio_right { + float: left; + text-align: left; + font-size: small; + padding-left: 5px; + } + + .new_filter_zone_cerif_radio_left { + float: left; + text-align: center; + font-size: small; + padding-right: 15px; + padding-left: 2px; + min-width: 30%; + } + + .new_filter_zone_row { + height: 3.5rem; + width: 100%; + padding-right: 5px; + } + + .tick_ok_ko { + max-width: 55%; + } + + .new_filter_zone_prix { + margin-bottom: 1.2rem; + margin-top: 1.2rem; + padding-right: 15px; + } + + .middle { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + + margin-left: auto; + margin-right: auto; + padding-top: 15%; + } + + input::placeholder { + color: white; + } + + .bienvenu { + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: x-large; + color: white; + } + + .categorie { + padding-top: 15%; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .met_polaroid { + text-align: center; + margin-top: 9rem; + } + + .met_polaroid_line2 { + text-align: center; + margin-top: 1rem; + margin-bottom: 1rem; + } + + .img_categorie_v2 { + border-radius: 5px; + background: white; + min-width: 3rem; + width: 9rem; + font-size: small; + border: 5px solid black; + box-shadow: 7px 6px 28px 1px rgba(0, 0, 0, 0.24); + cursor: pointer; + outline: none; + transition: 0.2s all; + margin-right: 1.5rem; + } + + .img_categorie_v2:active { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + .img_categorie_v2:hover { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + input:-webkit-autofill, + input:-webkit-autofill:hover, + input:-webkit-autofill:focus, + input:-webkit-autofill:active { + transition: background-color 5000000s ease-in-out 0s; + } + + .calage { + width: 2%; + } + + .tab_logo_metier { + width: 100%; + padding-left: 5px; + box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + padding-left: 10px; + border-radius: 10px; + padding-top: 10px; + } + + .tab_critere_espace { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 20px; + + width: 100%; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_nos_service { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 20px; + + position: absolute; + width: 96%; + height: 204px; + left: 2%; + top: 510px; + + } + + .block_nos_formation { + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + + width: 96%; + left: 2%; + top: 500px; + } + + .logo { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + position: absolute; + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .Menu_Header { + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 0px; + gap: 24px; + + position: absolute; + width: 843px; + height: 56px; + right: 72px; + top: 50px; + } + + + .Header_Content { + /* Auto layout * / + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + isolation: isolate; + + position: absolute; + width: 95%; + height: 367px; + left: 5%; + top: 136px;*/ + + width: 100%; + float: left; + width: 95%; + height: 367px; + left: 5%; + } + + .Background_Header { + position: absolute; + width: 100%; + height: 400px; + left: 0px; + + + /* Beige */ + + background: #f3f4fb; + z-index: -1; + + } + + .Logo_MySy { + width: 108px; + height: 36px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .training { + + width: 108px; + height: 12px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 900; + font-size: 10px; + line-height: 12px; + /* identical to box height */ + + letter-spacing: 0.83em; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .header_menu { + /* Les formations */ + cursor: pointer; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 17px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .bar_vert { + + width: 1px; + height: 24px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 10px; + + /* Inside auto layout */ + + flex: none; + order: 4; + flex-grow: 0; + } + + .cta1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 288px; + height: 56px; + + + /* Inside auto layout */ + + flex: none; + order: 6; + flex-grow: 0; + + } + + .cta2 { + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 126px; + height: 56px; + + /* Deep Blue */ + + border: 1px solid #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .cta3 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + } + + + .minscrire { + cursor: pointer; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .meconnecter { + cursor: pointer; + width: 112px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .rectangle_8 { + /* Rectangle 8 */ + + + position: absolute; + width: 500px; + height: 400px; + right: 5%; + top: 0px; + + background: url("../../mysy_img2/img_header.png") no-repeat; + filter: drop-shadow(0px 8px 14px rgba(0, 0, 0, 0.05)); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + z-index: 0; + } + + .content_search_bar { + + height: 367px; + margin-top: 5rem; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .title_desc_header { + width: 100%; + float: left; + height: 150px; + } + + .title1 { + width: 100%; + text-align: center; + height: 192px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 50px; + line-height: 54px; + letter-spacing: 1px; + color: #0A043C; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + } + + .title2 { + width: 90%; + text-align: left; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .search_bar_h { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 10px; + + width: 100%; + height: 113px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 12px 0px 24px; + gap: 72px; + + width: 100%; + height: 60px; + + /* White */ + + background: #FFFFFF; + box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.08); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + border: 1px solid #E2E9FB; + border-radius: 60px; + + } + + .frame_153 { + /* Frame 153 */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px 27px; + gap: 10px; + + width: 588px; + height: 17px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_153_txt { + width: 534px; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + display: flex; + align-items: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .input_search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 24px; + + width: 100%; + height: 80px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .cta_recherche { + cursor: pointer; + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 142px; + height: 56px; + + /* Green */ + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .cta_recherche_txt { + width: 90px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 17px; + line-height: 30px; + /* identical to box height, or 176% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .search_dropdown { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 20%; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .search_bar_rectangle { + width: 1px; + height: 60px; + + background: rgba(0, 0, 0, 0.08); + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_text { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 80%; + height: 32px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .nos_serv_background { + position: absolute; + width: 1440px; + height: 436px; + left: 0px; + top: 452px; + + /* White */ + + background: #FFFFFF; + } + + .nos_serv_txt { + width: 227px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .nos_serv_list { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 56px; + + width: 95%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .nos_serv_serv2 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv3 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .block_filter { + /* Block Filters */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 24px; + + width: 309px; + height: 1110px; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_formation { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 947px; + height: 2486px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + margin-bottom: 3rem; + } + + .sous_filter_metier { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 100%; + } + + .sous_filter_txt { + /* Les filtres */ + + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_separator { + width: 277px; + height: 0px; + + opacity: 0.08; + /* Deep Blue */ + + border: 1px solid #0A043C; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 12px; + + width: 277px; + height: 494px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_mertier { + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 277px; + height: 496px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .filter_valeur { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 71px; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .filter_valeur_txt { + /* Eligible CPF */ + + + letter-spacing: 2px; + height: 19px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 19px; + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .filter_valeur_block_val { + /* List Checkbox */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 100%; + height: 48px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_133 { + /* Frame 133 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 1; + } + + .frame_133_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 50px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_radio { + /* Radio Button */ + + cursor: pointer; + width: 16px; + height: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_txt { + /* Oui */ + + + width: 26px; + height: 22px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .frame_134 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_134_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 55px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .frame_135 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 50px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_135_grp { + /* Checbox + Text */ + + margin-left: 10px; + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 30px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + + .filter_txt { + /* Les filtres */ + + + width: 92px; + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block { + /* Filter */ + + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 16px; + gap: 10px; + + width: 90%; + height: 72px; + + /* White */ + + background: #FFFFFF; + border: 1px solid #DFDFDF; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + + } + + .filter_metier_sous_block_content { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 12px; + + width: 180px; + height: 40px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_radio { + + /* Radio Button */ + + + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_txt { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 144px; + height: 40px; + + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_formation { + width: 144px; + height: 22px; + + text-align: left; + margin-top: 10px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_nb { + width: 85px; + height: 14px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 14px; + + /* Deep Blue */ + + color: #0A043C; + + opacity: 0.7; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .filter_metier_sous_block_plus_metier { + /* Icon + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 233px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_1 { + border: #0A043C solid; + width: 24px; + height: 24px; + + cursor: pointer; + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_2 { + width: 201px; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .block_actualite { + /* Actualité */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + position: absolute; + width: 100%; + height: 549px; + top: 4150px; + display: none; + } + + .block_actualite_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 100%; + height: 453px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_actualite_sous_block_text { + width: 261px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 95%; + height: 365px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + + } + + .block_list_actu_actu1 { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 23px; + + width: 32%; + height: 364px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_img { + width: 100%; + height: 250px; + + background: url(https://img.mysy-training.com/img_actu1.png) no-repeat; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text { + /* Date + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px 0px 0px 8px; + gap: 8px; + + height: 91px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_date { + width: 152px; + height: 19px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 19px; + text-transform: uppercase; + + /* Blue */ + + color: #3E6EE3; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_txt { + + height: 64px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: medium; + line-height: 32px; + /* or 133% */ + + letter-spacing: -0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .pieddepage_v2 { + position: relative; + width: 100%; + + left: 0px; + top: 5650px; + background: #FFF5DA; + z-index: -1; + + } + + .bton_tout_nos_article { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .bton_tout_nos_article_account_box { + display: none; + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .bton_tout_nos_article_txt { + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_partner { + /* Partner Block */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 40px; + gap: 10px; + + position: absolute; + width: 90%; + height: 386px; + left: 72px; + top: 4450px; + ; + + /* White */ + + background: #FFFFFF; + /* Shadow 01 */ + + box-shadow: 0px 54px 100px rgba(10, 4, 60, 0.08); + border-radius: 8px; + + } + + .block_partner_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 24px; + + width: 858px; + height: 306px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 16px; + + width: 858px; + height: 226px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_logo { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 4px; + + width: 160px; + height: 76px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_desc { + width: 600px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 25px; + line-height: 28px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_txt { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_buton { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Green */ + + background: #20BFA9; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .logo_not_absolut { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .block_partner_sous_block_logo_desc_desc2 { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .form-select { + height: 2.5rem !important; + border-radius: 0px; + font-size: small; + } + + .domaine_icone { + margin-top: 5px; + } + + .domaine_icone_fa { + margin-top: 5px; + margin-right: 5px; + cursor: pointer; + } + + .fron_search { + border: none; + font-size: medium; + padding-right: 5px; + } + + + .service1_img { + + left: 0px; + top: 0px; + + background: #D6EBE4; + opacity: 1; + border-radius: 1rem; + margin-top: 1rem; + } + + .service1_title_desc { + /* Title + Description */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 70%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .service1_title { + + width: 100%; + + text-align: left; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 20px; + line-height: 32px; + /* identical to box height, or 133% */ + + letter-spacing: -0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .service1_desc { + + text-align: left; + height: 80px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 20px; + /* or 143% */ + + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .img_service { + width: 100%; + height: 4rem; + border-radius: 1rem; + } + + + .forma_et_tuto { + width: 99%; + margin-left: 5px; + height: 80px; + padding-top: 10px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + background: #F7F7F7; + } + + .forma_et_tuto_mobile { + display: none; + } + + .cta_publication { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: red; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + } + + .cta_publication_v2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: #53B7EB; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + text-decoration: none; + -webkit-animation: glowing 1500ms 4; + -moz-animation: glowing 1500ms 4; + -o-animation: glowing 1500ms 4; + animation: glowing 1500ms 4; + + } + + @-webkit-keyframes glowing { + 0% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + } + + @-moz-keyframes glowing { + 0% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + } + + @-o-keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + @keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + + + .cta_hebergement { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: rebeccapurple; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + } + + .search_bar_2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 1px 0px 2px; + gap: 72px; + + width: 100%; + height: 10px; + + /* White */ + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + margin-bottom: 2rem !important; + text-align: left; + padding-left: 1rem; + } + + .bton_ensavoir_plus { + border-radius: 5rem; + font-size: medium; + background: #81BC3A !important; + text-align: center; + height: 2.5rem; + width: 100%; + color: white; + margin-left: 10px; + margin-right: 10px; + padding-top: 10px; + cursor: pointer; + } + + .block_newletter { + font-size: 18px; + font-weight: 400; + width: 100%; + line-height: 1px; + margin-top: 20px; + } + + .block_newletter_email { + width: 80%; + float: left; + + } + + .block_newletter_bton_ok { + width: 20%; + float: left; + margin-top: 10px; + position: relative; + left: -5px; + } + + .block_newletter_bton_bton_ok { + height: 3rem; + border: solid 1px black; + background: #0A043C; + color: white; + width: 80%; + + } + + .cta_recherche_img_search_loup { + width: 50%; + margin-right: -5px; + } + + .block_formation { + flex: 1 1 300px; + display: flex; + flex-direction: column; + gap: 40px; + + background-color: rgba(253, 246, 236, 0.1); + border-radius: 12px; + border: 1px solid #ecae49; + max-width: 400px; + box-sizing: border-box; + flex-grow: 1; + background: #FFF; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; + display: flex; + flex-direction: column; + border: 1px solid #E2E9FB + } + + .block_display_flex_formation { + display: flex; + flex-direction: row; + gap: 20px; + width: 100%; + flex-wrap: wrap; + justify-content: left; + } + + + } + + @media only screen and (min-width: 1920px) { + .block_pagination { + width: 50%; + float: left; + + } + + .block_trier_par { + width: 40%; + float: right; + } + + .calage { + width: 2%; + } + + /* Ordi de bureau et grands ecrans*/ + .align_gauche { + margin-left: 0rem; + width: 100%; + float: right; + text-align: left; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + } + + .recherchefilter { + display: none; + } + + .okUpdateData { + font-size: small; + color: green; + font-style: italic; + } + + .koUpdateData { + font-size: small; + color: red; + font-style: italic; + } + + .rech_container { + width: 90%; + height: 200px; + background: aqua; + margin: auto; + padding: 10px; + border-radius: 30px; + } + + .rech_leftbox { + float: left; + border-width: 1px; + width: 100%; + + padding: 0.5rem; + border-radius: 1rem; + margin-bottom: 0.1rem; + font-size: small !important; + font-family: "verdana", "Quicksand", "Signika", sans-serif !important; + background: white; + margin-left: 5px; + padding-left: 5px; + background: #FFF; + height: auto; + } + + .rech_middlebox { + float: left; + border-width: 2px; + width: 75%; + height: 100%; + margin: auto; + padding: 0rem; + border-radius: 30px; + margin-right: 0%; + padding-left: 1rem; + padding-right: 10px; + background: #FFF; + + } + + .rech_rightbox { + + display: none; + } + + .rech_rightbox .button2 { + opacity: 1; + background: #619e31; + border: 1px; + outline: 0; + border-bottom: 2px solid transparent; + color: white; + font-size: medium !important; + border-radius: 1rem; + margin: 0px; + padding: 0px; + text-align: center; + margin-bottom: 0.5rem; + } + + .rech_rightbox_inside { + float: left; + width: 100%; + height: 100%; + margin: auto; + padding: 0px; + border-radius: 0px; + margin-right: 0%; + overflow-y: scroll; + height: 800px; + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + padding-right: 5px; + margin-right: 5px; + } + + .textsurimage { + color: rgb(218, 207, 207); + background-color: transparent; + font-size: 40pt; + text-align: center; + position: absolute; + top: 30%; + left: 50%; + transform: translate(-50%, -50%); + position: absolute; + } + + .rech_list_formation2 { + display: inline-block; + width: 100%; + background-color: white; + height: auto; + padding: 1px; + outline: 1px solid #ccc; + margin: 0; + text-align: left; + border-radius: 10px; + margin-bottom: 10px; + background-color: white; + + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + } + + .rech_list_formation2:hover { + -webkit-box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + box-shadow: 1px 1px 20px 1px rgb(0 0 0 / 25%); + } + + .textsurimage23 { + color: rgb(218, 207, 207); + background-color: transparent; + text-align: center; + position: absolute; + top: 20%; + left: 40%; + } + + h4 { + display: inline-block; + font-size: xx-large; + /*or whatever you want*/ + color: white; + } + + .default_font { + color: #3c4043; + display: inline-block; + line-height: 28px; + font-size: medium; + } + + .form-input { + border-radius: 10rem; + height: 3rem; + font-size: medium; + line-height: 1.5; + margin-bottom: 4px; + color: white; + border: 2.5px solid white; + background: transparent; + box-shadow: none; + } + + .form { + font-size: medium; + width: 100%; + margin-left: 0; + margin-right: 0; + margin-bottom: 0.5rem; + position: relative; + margin-top: 1rem; + z-index: 11; + display: flex; + } + + .form span { + position: absolute; + right: 0.2rem; + top: 0.1rem; + padding: 2px; + border-left: 0.2rem solid white; + height: 3rem; + } + + .form span_clear { + position: absolute; + right: 1.5rem !important; + top: 0.1rem !important; + padding: 2px; + border-left: 0.2rem solid white !important; + height: 3rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + } + + form svg { + margin-top: 0.8rem !important; + height: 1.5rem !important; + cursor: pointer; + } + + .left-pan { + padding-left: 7px; + } + + .left-pan i { + padding-left: 10px; + } + + .containerBox { + position: fixed; + margin-top: 0.5rem; + height: 10rem; + border: 0.2rem solid #0d0e10; + width: 100%; + background-color: #999; + } + + .containerBox0 { + float: left; + width: 30%; + } + + .text_head_droite { + color: #3b3e40; + font-family: "lucida", "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + font-weight: bold; + text-align: right; + } + + .text_head_gauche { + color: #3b3e40; + font-family: "lucida", "verdana", "Quicksand", "Signika", sans-serif; + font-size: small; + font-weight: bold; + text-align: left; + } + + .text_head { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .text-box { + position: absolute; + height: 100%; + text-align: center; + width: 100%; + } + + .text-box:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + } + + .img_logo { + display: block; + height: auto; + margin-left: 0px; + margin-right: auto; + max-width: 18%; + max-height: 3rem; + } + + .form-select { + height: 2.5rem !important; + border-radius: 0px; + font-size: small; + } + + .mb-3 { + margin-bottom: 0.7rem !important; + font-size: xx-small !important; + cursor: pointer; + } + + .input-group-text { + font-size: x-small !important; + padding-left: 0px !important; + } + + .filter_span { + padding-top: 0.3rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + color: #107758; + font-size: 0.75rem; + white-space: nowrap; + width: 20%; + padding-top: 10px; + + } + + .filter_val { + padding-top: 0.1rem; + padding-bottom: auto; + word-break: break-word; + margin-right: 0.5rem; + font-size: 0.9rem; + white-space: nowrap; + border: none; + background: transparent; + color: #3b3e40; + font-family: "DM Sans", "verdana", "Quicksand", "Signika"; + border: 1px solid #C7C9CE; + border-radius: 0.3rem !important; + width: 65%; + margin-top: 0.3rem; + margin-right: 0px; + } + + .div_row2 { + float: left; + + border-width: 0.01rem; + width: 100%; + margin-bottom: 0.1rem; + + + z-index: 10; + min-height: 30rem; + } + + .div_row_haut { + float: left; + + width: 100%; + + background-color: #3b3e40; + z-index: 10; + } + + .div_mobile { + z-index: -1; + width: 100%; + height: 100%; + } + + .pieddepage { + z-index: 50; + width: 100%; + float: left; + color: white !important; + margin-top: 5rem; + } + + .menuPrincipal_bton { + margin-left: 0.9rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + } + + .menuPrincipal { + margin-left: 1rem; + font-family: "Quicksand", "Signika", "sans-serif"; + color: white; + float: right; + cursor: pointer; + text-align: right; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + padding-top: 0.2rem; + } + + .menuPrincipal:hover { + color: #81bc3a; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.1rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; + } + + .div_001 { + width: 90%; + margin-left: auto; + margin-right: auto; + } + + .div_002 { + float: left; + width: 50%; + text-align: left; + } + + .div_003 { + float: left; + width: 50%; + text-align: right; + color: white; + } + + .div_004 { + color: white; + width: 100%; + height: 0.25rem; + opacity: 100%; + margin-left: auto; + margin-right: auto; + float: left; + margin: 0.2rem; + } + + .div_005 { + width: 100%; + float: left; + } + + .hilightsoustitre { + background: #113459; + color: #fff; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + letter-spacing: 0.2rem; + } + + .hilightsoustitre_v2 { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + height: 3rem; + padding-top: 5px; + } + + .hilightsoustitre_v2_metier { + color: #3b3e40; + display: block; + font-size: 1rem; + margin-bottom: 0.5rem; + background: #e9ecef; + border-radius: 5px; + background: #113459; + color: #fff; + letter-spacing: 2px; + margin-top: 5rem; + height: 3rem; + padding-top: 5px; + } + + .tab_gauche { + width: 50%; + float: left; + text-align: left; + } + + .tab_droite { + width: 50%; + float: right; + text-align: right; + } + + .tab_gauche_metier { + width: 30%; + float: left; + text-align: left; + margin: 2px; + } + + .tab_droite_metier { + width: 50%; + float: right; + text-align: right; + } + + .img_thematique_metier { + display: block; + border-radius: 10rem; + max-width: 360px; + } + + .met_polaroid_gauche { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_gauche:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_polaroid_droite { + width: 97%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + margin-left: 3%; + cursor: pointer; + border-radius: 12px; + } + + .met_polaroid_droite:hover { + transition-duration: 0.5s; + transform: scale(1.1); + box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25); + } + + .met_container { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + font-weight: bold; + } + + .met_text { + margin-bottom: 0.1rem; + font-size: small; + font-weight: normal; + white-space: nowrap; + overflow: hidden; + letter-spacing: 1px; + + } + + .met_text_larg { + margin-bottom: 0.1rem; + font-size: xx-small; + font-weight: bold; + white-space: nowrap; + overflow: hidden; + } + + .met_text_all_categories { + margin-bottom: 0.1rem; + font-size: x-small; + margin-top: 1rem; + } + + .met_container_all_categories { + text-align: center; + padding: 1px 2px; + letter-spacing: 2px; + font-size: small; + color: #3b3e40; + height: 3rem; + } + + .met_polaroid_gauche_all_categories { + width: 100%; + background-color: white; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), + 0 6px 20px 0 rgba(0, 0, 0, 0.19); + margin-bottom: 5px; + cursor: pointer; + border-radius: 12px; + } + + .tab_gauche_all_categories { + width: 100%; + float: left; + text-align: left; + } + + .img_categorie { + width: 100%; + border-top-right-radius: 12px; + border-radius: 12px; + padding: 5px; + } + + .h1_transparent { + color: transparent; + font-size: 0.1rem; + } + + .mymenu_item { + font-size: 1rem !important; + } + + .MuiMenuItem-root { + font-size: 1rem !important; + + } + + .new_filter_zone { + float: left; + width: 35%; + display: flex; + align-items: center; + font-size: small; + line-height: 1.5; + color: #212529; + text-align: center; + white-space: nowrap; + margin-top: 5px; + } + + .new_filter_zone_cerif_radio { + width: 30%; + float: left; + text-align: right; + font-size: smaller; + } + + .new_filter_zone_cerif_radio_right { + + float: left; + text-align: left; + font-size: small; + padding-left: 5px; + } + + .new_filter_zone_cerif_radio_left { + + float: left; + text-align: center; + font-size: small; + padding-right: 15px; + padding-left: 2px; + min-width: 30%; + } + + .new_filter_zone_row { + margin-bottom: 0.7rem !important; + width: 100%; + padding-right: 5px; + } + + .tick_ok_ko { + max-width: 55%; + + } + + .new_filter_zone_prix { + margin-bottom: 1.2rem; + margin-top: 1.2rem; + padding-right: 15px; + } + + .middle { + color: white; + font-family: "verdana", "Quicksand", "Signika", "sans-serif"; + font-size: 1.2rem; + + margin-left: auto; + margin-right: auto; + padding-top: 15%; + } + + input::placeholder { + color: white; + } + + .bienvenu { + font-family: "verdana", "Quicksand", "Signika", sans-serif; + font-size: x-large; + color: white; + } + + .categorie { + padding-top: 15%; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .met_polaroid { + text-align: center; + margin-top: 9rem; + } + + .met_polaroid_line2 { + text-align: center; + margin-top: 1rem; + margin-bottom: 1rem; + } + + .img_categorie_v2 { + border-radius: 5px; + background: white; + min-width: 3rem; + width: 9rem; + font-size: small; + border: 5px solid black; + box-shadow: 7px 6px 28px 1px rgba(0, 0, 0, 0.24); + cursor: pointer; + outline: none; + transition: 0.2s all; + margin-right: 1.5rem; + } + + .img_categorie_v2:active { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + .img_categorie_v2:hover { + transform: scale(1.1); + /* Scaling button to 0.98 to its original size */ + box-shadow: 3px 2px 22px 1px rgba(0, 0, 0, 0.24); + /* Lowering the shadow */ + } + + input:-webkit-autofill, + input:-webkit-autofill:hover, + input:-webkit-autofill:focus, + input:-webkit-autofill:active { + transition: background-color 5000000s ease-in-out 0s; + } + + .div_row_bas { + float: right; + width: 100%; + min-height: 100%; + height: 60rem; + + background-color: #e7f3fb; + z-index: 10; + background: url("../../mysy_img/mysy_home.jpg") no-repeat; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + + } + + .tab_logo_metier { + width: 100%; + padding-left: 15px; + box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + padding-left: 20px; + border-radius: 10px; + padding-top: 10px; + } + + /*.tab_critere_espace { + margin-bottom: 1.5rem; + padding-bottom: 1.5rem; + box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 50%); + padding-left: 10px; + border-radius: 10px; + padding-top: 10px; + }*/ + + .tab_critere_espace { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 20px; + + width: 100%; + + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_nos_service { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 30px; + + position: absolute; + width: 96%; + height: 204px; + left: 2%; + top: 510px; + + } + + .block_nos_formation { + + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + + width: 96%; + + left: 2%; + top: 500px; + } + + .logo { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + position: absolute; + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .Menu_Header { + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 0px; + gap: 24px; + + position: absolute; + width: 843px; + height: 56px; + right: 72px; + top: 50px; + } + + .Header_Content { + /* Auto layout * / + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + isolation: isolate; + + position: absolute; + width: 95%; + height: 367px; + left: 5%; + top: 136px;*/ + + width: 100%; + float: left; + width: 95%; + height: 367px; + left: 5%; + } + + .Background_Header { + position: absolute; + width: 100%; + height: 400px; + left: 0px; + + + /* Beige */ + + background: #f3f4fb; + z-index: -1; + + } + + .Logo_MySy { + width: 108px; + height: 36px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .training { + + width: 108px; + height: 12px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 900; + font-size: 10px; + line-height: 12px; + /* identical to box height */ + + letter-spacing: 0.83em; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .header_menu { + /* Les formations */ + cursor: pointer; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 17px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .bar_vert { + + width: 1px; + height: 24px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 10px; + + /* Inside auto layout */ + + flex: none; + order: 4; + flex-grow: 0; + } + + .cta1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 288px; + height: 56px; + + + /* Inside auto layout */ + + flex: none; + order: 6; + flex-grow: 0; + + } + + .cta2 { + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 126px; + height: 56px; + + /* Deep Blue */ + + border: 1px solid #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .cta3 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + } + + + .minscrire { + cursor: pointer; + + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .meconnecter { + cursor: pointer; + width: 112px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 30px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .rectangle_8 { + /* Rectangle 8 */ + + + position: absolute; + width: 500px; + height: 400px; + + right: 10rem; + top: 0px; + + background: url("../../mysy_img2/img_header.png") no-repeat; + filter: drop-shadow(0px 8px 14px rgba(0, 0, 0, 0.05)); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + z-index: 0; + } + + .content_search_bar { + height: 367px; + margin-top: 5rem; + width: 80%; + margin-left: auto; + margin-right: auto; + } + + .title_desc_header { + + + width: 100%; + float: left; + height: 150px; + } + + .title1 { + + width: 100%; + text-align: center; + height: 192px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 50px; + line-height: 54px; + letter-spacing: 1px; + color: #0A043C; + flex: none; + flex-grow: 0; + order: 0; + flex-grow: 0; + } + + .title2 { + width: 100%; + text-align: left; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .search_bar_h { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 100%; + height: 113px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 12px 0px 24px; + gap: 72px; + + width: 100%; + height: 60px; + + /* White */ + + background: #FFFFFF; + box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.08); + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + border: 1px solid #E2E9FB; + border-radius: 60px; + + } + + .frame_153 { + /* Frame 153 */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px 27px; + gap: 10px; + + width: 588px; + height: 17px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_153_txt { + width: 534px; + height: 17px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 17px; + /* identical to box height */ + + display: flex; + align-items: center; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .input_search_bar { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 24px; + + width: 100%; + height: 80px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .cta_recherche { + + cursor: pointer; + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 142px; + height: 56px; + + /* Green */ + + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .cta_recherche_txt { + width: 90px; + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 17px; + line-height: 30px; + /* identical to box height, or 176% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .search_dropdown { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 20%; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .search_bar_rectangle { + width: 1px; + height: 60px; + + background: rgba(0, 0, 0, 0.08); + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .search_text { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 80%; + height: 32px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .nos_serv_background { + position: absolute; + width: 1440px; + height: 436px; + left: 0px; + top: 452px; + + /* White */ + + background: #FFFFFF; + } + + .nos_serv_txt { + width: 227px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .nos_serv_list { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px; + gap: 56px; + + width: 95%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv1 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .nos_serv_serv2 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .nos_serv_serv3 { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 16px; + + width: 32%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .block_filter { + /* Block Filters */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 16px; + gap: 24px; + + width: 309px; + height: 1110px; + + /* White */ + + background: #FFFFFF; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_formation { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 947px; + height: 2486px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + margin-bottom: 3rem; + } + + .sous_filter_metier { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 16px; + + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + width: 100%; + } + + .sous_filter_txt { + /* Les filtres */ + + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .sous_filter_separator { + width: 277px; + height: 0px; + + opacity: 0.08; + /* Deep Blue */ + + border: 1px solid #0A043C; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_filter_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 12px; + + width: 277px; + height: 494px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .sous_mertier { + /* Auto layout */ + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 277px; + height: 496px; + + + /* Inside auto layout */ + + flex: none; + order: 2; + flex-grow: 0; + } + + .filter_valeur { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 100%; + height: 71px; + + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + } + + .filter_valeur_txt { + /* Eligible CPF */ + + + letter-spacing: 2px; + height: 19px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 14px; + line-height: 19px; + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + + .filter_valeur_block_val { + /* List Checkbox */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 8px; + + width: 100%; + height: 48px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .frame_133 { + /* Frame 133 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 1; + } + + .frame_133_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 50px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_radio { + /* Radio Button */ + cursor: pointer; + + width: 16px; + height: 16px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .frame_133_grp_txt { + /* Oui */ + + + width: 26px; + height: 22px; + + font-family: 'Manrope'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .frame_134 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 90px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_134_grp { + /* Checbox + Text */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 55px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .frame_135 { + /* Frame 134 */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 5px; + gap: 10px; + + width: 50px; + height: 35px; + + /* Light Grey */ + + background: #F7F7F7; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 1; + } + + .frame_135_grp { + /* Checbox + Text */ + + margin-left: 10px; + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 30px; + height: 22px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + + .filter_txt { + /* Les filtres */ + + + width: 92px; + height: 24px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 800; + font-size: 20px; + line-height: 24px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block { + /* Filter */ + + box-sizing: border-box; + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 16px; + gap: 10px; + + width: 90%; + height: 72px; + + /* White */ + + background: #FFFFFF; + border: 1px solid #DFDFDF; + border-radius: 4px; + + /* Inside auto layout */ + + flex: none; + flex-grow: 0; + + } + + .filter_metier_sous_block_content { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 12px; + + width: 180px; + height: 40px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_radio { + + /* Radio Button */ + + + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_content_txt { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 144px; + height: 40px; + + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_formation { + width: 144px; + height: 22px; + + text-align: left; + margin-top: 10px; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .filter_metier_sous_block_content_txt_nb { + width: 85px; + height: 14px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 12px; + line-height: 14px; + + /* Deep Blue */ + + color: #0A043C; + + opacity: 0.7; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .filter_metier_sous_block_plus_metier { + /* Icon + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px; + gap: 8px; + + width: 233px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_1 { + border: #0A043C solid; + width: 24px; + height: 24px; + cursor: pointer; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .filter_metier_sous_block_plus_metier_2 { + width: 201px; + height: 22px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 18px; + line-height: 22px; + /* identical to box height */ + + display: flex; + align-items: center; + font-feature-settings: 'liga' off; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + + .block_actualite { + /* Actualité */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + position: absolute; + width: 100%; + height: 549px; + + top: 4300px; + display: none; + + } + + .block_actualite_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 40px; + + width: 100%; + height: 453px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_actualite_sous_block_text { + width: 261px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu { + display: flex; + flex-direction: row; + align-items: flex-start; + padding: 0px; + gap: 24px; + + width: 95%; + height: 365px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + + + } + + .block_list_actu_actu1 { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 23px; + + width: 32%; + height: 364px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_img { + width: 100%; + height: 250px; + + background: url(https://img.mysy-training.com/img_actu1.png) no-repeat; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .block_list_actu_actu1_date_text { + /* Date + Title */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px 0px 0px 8px; + gap: 8px; + + height: 91px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_date { + width: 152px; + height: 19px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 19px; + text-transform: uppercase; + + /* Blue */ + + color: #3E6EE3; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_list_actu_actu1_date_text_txt { + + height: 64px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: medium; + line-height: 32px; + /* or 133% */ + + letter-spacing: -0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .jmj_pied_page { + position: relative; + width: 100%; + left: 0px; + + background: #FFF5DA; + z-index: -1; + + } + + .bton_tout_nos_article { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Deep Blue */ + + background: #0A043C; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .bton_tout_nos_article_account_box { + display: none; + width: 24px; + height: 24px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + + } + + .bton_tout_nos_article_txt { + height: 30px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 16px; + line-height: 22px; + /* identical to box height, or 188% */ + + display: flex; + align-items: center; + text-align: center; + + /* White */ + + color: #FFFFFF; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + + } + + .block_partner { + /* Partner Block */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + justify-content: flex-end; + align-items: center; + padding: 40px; + gap: 10px; + + position: absolute; + width: 90%; + height: 386px; + left: 72px; + top: 4500px; + + /* White */ + + background: #FFFFFF; + /* Shadow 01 */ + + box-shadow: 0px 54px 100px rgba(10, 4, 60, 0.08); + border-radius: 8px; + + } + + .block_partner_sous_block { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 24px; + + width: 858px; + height: 306px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc { + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 16px; + + width: 858px; + height: 226px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_logo { + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: center; + padding: 0px; + gap: 4px; + + width: 160px; + height: 76px; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .block_partner_sous_block_logo_desc_desc { + width: 600px; + height: 48px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 25px; + line-height: 28px; + /* identical to box height */ + + text-align: center; + letter-spacing: -1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_txt { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .block_partner_sous_block_buton { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 13px 26px; + gap: 10px; + + width: 299px; + height: 56px; + + /* Green */ + + background: #20BFA9; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .logo_not_absolut { + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 108px; + height: 52px; + left: 72px; + top: 52px; + } + + .block_partner_sous_block_logo_desc_desc2 { + width: 858px; + height: 72px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 16px; + line-height: 24px; + /* or 150% */ + + text-align: center; + font-feature-settings: 'liga' off; + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .form-select { + height: 2.5rem !important; + border-radius: 0px; + font-size: small; + } + + .domaine_icone { + margin-top: 5px; + } + + .domaine_icone_fa { + margin-top: 5px; + margin-right: 5px; + cursor: pointer; + } + + .fron_search { + border: none; + font-size: medium; + padding-right: 5px; + } + + + .service1_img { + + left: 0px; + top: 0px; + + background: #D6EBE4; + opacity: 1; + border-radius: 1rem; + margin-top: 1rem; + } + + .service1_title_desc { + /* Title + Description */ + + + /* Auto layout */ + + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 0px; + gap: 4px; + + width: 70%; + height: 116px; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .service1_title { + + + width: 100%; + height: 32px; + text-align: left; + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 600; + font-size: 20px; + line-height: 32px; + /* identical to box height, or 133% */ + + letter-spacing: 0.3px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + } + + .service1_desc { + text-align: left; + height: 80px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 20px; + /* or 143% */ + + + /* Bold Grey */ + + color: #4B4B4B; + + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + } + + .img_service { + width: 100%; + height: 4rem; + border-radius: 1rem; + } + + .forma_et_tuto { + width: 99%; + margin-left: 5px; + height: 80px; + padding-top: 10px; + + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 48px; + /* identical to box height */ + + text-align: center; + letter-spacing: 1px; + + /* Deep Blue */ + + color: #0A043C; + + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + background: #F7F7F7; + } + + .forma_et_tuto_mobile { + display: none; + } + + .cta_publication { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: red; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + } + + .cta_publication_v2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + + background: #53B7EB; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + text-decoration: none; + -webkit-animation: glowing 1500ms 4; + -moz-animation: glowing 1500ms 4; + -o-animation: glowing 1500ms 4; + animation: glowing 1500ms 4; + + } + + @-webkit-keyframes glowing { + 0% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -webkit-box-shadow: 0 0 3px #B20000; + } + } + + @-moz-keyframes glowing { + 0% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + -moz-box-shadow: 0 0 3px #B20000; + } + } + + @-o-keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + @keyframes glowing { + 0% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + + 50% { + background-color: #53B7EB; + box-shadow: 0 0 40px #FF0000; + } + + 100% { + background-color: #53B7EB; + box-shadow: 0 0 3px #B20000; + } + } + + + .cta_hebergement { + /* Auto layout */ + + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 5px 5px; + gap: 10px; + + width: 154px; + height: 56px; + + /* Deep Blue */ + + background: rebeccapurple; + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 1; + flex-grow: 0; + text-transform: uppercase; + color: white; + font-weight: normal; + font-size: 14px; + } + + + .search_bar_2 { + /* Auto layout */ + + display: flex; + flex-direction: row; + align-items: center; + padding: 0px 1px 0px 2px; + gap: 72px; + + width: 100%; + height: 10px; + + border-radius: 8px; + + /* Inside auto layout */ + + flex: none; + order: 0; + flex-grow: 0; + margin-bottom: 1rem; + text-align: left; + + + } + + .bton_ensavoir_plus { + border-radius: 5rem; + font-size: medium; + background: #81BC3A !important; + text-align: center; + height: 2.5rem; + width: 100%; + color: white; + margin-left: 10px; + margin-right: 10px; + padding-top: 10px; + cursor: pointer; + } + + .bton_menu_v2 { + background-color: white; + width: 100%; + border: 0px; + text-align: left; + color: black; + letter-spacing: 2px; + margin: 10px; + + } + + .bton_menu_v2:hover { + + letter-spacing: 3px; + + } + + .block_newletter { + font-size: 18px; + font-weight: 400; + width: 100%; + line-height: 15px; + margin-top: 20px; + } + + .block_newletter_email { + width: 80%; + float: left; + + } + + .block_newletter_bton_ok { + width: 20%; + float: left; + margin-top: 10px; + position: relative; + left: -5px; + } + + .block_newletter_bton_bton_ok { + height: 3rem; + border: solid 1px black; + background: #0A043C; + color: white; + width: 80%; + + } + + .cta_recherche_img_search_loup { + width: 50%; + margin-right: -5px; + } + + + .block_formation { + flex: 1 1 300px; + display: flex; + flex-direction: column; + gap: 40px; + + background-color: rgba(253, 246, 236, 0.1); + border-radius: 12px; + border: 1px solid #ecae49; + max-width: 400px; + box-sizing: border-box; + flex-grow: 1; + background: #FFF; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + overflow: hidden; + display: flex; + flex-direction: column; + border: 1px solid #E2E9FB + } + + .block_display_flex_formation { + display: flex; + flex-direction: row; + gap: 24px; + width: 100%; + flex-wrap: wrap; + justify-content: left; + } + + + } + + + /* end media */ + + + .jmj_pied_page { + position: relative; + width: 100%; + left: 0px; + background: #FFF5DA; + z-index: -1; + } + + + + .css-1v4ccyo { + height: 3rem !important; + } + + .message_hili { + color: #619e31; + font-weight: bold; + opacity: 0.8; + background: transparent; + + border-radius: 5px; + } + + .buton_ch22 { + border: 2px solid white; + background-color: transparent; + color: white; + padding: 0px; + font-size: 16px; + cursor: pointer; + font-size: small; + border-radius: 4rem; + width: 6rem; + min-width: 6rem; + height: 1.7rem; + text-align: left; + } + + .ch_form-input { + border-radius: 10rem; + height: 3rem; + font-size: medium; + line-height: 1.5; + margin-bottom: 4px; + color: white; + border: 2.5px solid white; + background: transparent; + width: 5rem; + } + + .MuiPaper-rounded { + top: 60px !important; + } + + .bton_menu_v2 { + background-color: white; + width: 100%; + border: 0px; + text-align: left; + color: black; + letter-spacing: 2px; + margin: 10px; + + } + + .bton_menu_v2:hover { + + letter-spacing: 3px; + + } + + + +} + +.header_img_logo22 { + display: block; + height: auto; + margin-left: 0px; + margin-right: auto; + + max-height: 3rem; +} + +.header_menuPrincipal_left { + @media only screen and (max-width: 600px) { + display: none; + } + + margin-left: 0.9rem; + font-family: "Quicksand", + "Signika", + "sans-serif"; + color: white; + cursor: pointer; + text-align: left; + font-size: small; + border: 2px solid transparent; + white-space: nowrap; + text-transform: uppercase; + padding-top: 0.2rem; + + width: 20%; + float: left; +} + +.header_menuPrincipal_left:hover { + color: #81bc3a; + padding-left: 0; + transition: color 0.3s linear; + letter-spacing: 0.1rem; + text-decoration: solid; + text-underline-offset: 3px; + border-bottom-width: 1px; + border-bottom-style: solid; + text-decoration: underline; +} + +.MuiPaper-rounded { + border-radius: 0px !important; +} + + + + + +.iSfofc { + width: 90% !important; + margin-left: auto !important; + margin-right: auto !important; + margin-top: 0.2rem !important; + background: white; + padding-top: 0.5rem !important; +} + +.dHtlYi { + background: #107758; +} + +.bQSvsY { + background: white !important; +} + +.MuiMenu-paper { + border-radius: 10px !important; +} + +.MuiListItem-button { + background: white !important; +} \ No newline at end of file diff --git a/src/components/Jmj_Theme_ok.zip b/src/components/Jmj_Theme_ok.zip new file mode 100644 index 0000000..893536f Binary files /dev/null and b/src/components/Jmj_Theme_ok.zip differ diff --git a/src/components/New_C_Formation_2025.js b/src/components/New_C_Formation_2025.js index f9857b9..db7df73 100644 --- a/src/components/New_C_Formation_2025.js +++ b/src/components/New_C_Formation_2025.js @@ -1,7 +1,7 @@ import React, { useState, useEffect } from "react"; import { useHistory } from "react-router-dom"; - + import { useCookies } from "react-cookie"; import { confirmAlert } from 'react-confirm-alert'; diff --git a/src/components/UpdatePartnerInfo.js b/src/components/UpdatePartnerInfo.js index 0904df4..8c2e98d 100644 --- a/src/components/UpdatePartnerInfo.js +++ b/src/components/UpdatePartnerInfo.js @@ -1,24 +1,22 @@ import React, { useState, useEffect, } from "react"; import { useForm } from "react-hook-form"; import { getCookie, setCookie } from 'react-use-cookie'; -import Box from '@mui/material/Box'; -import InputLabel from '@mui/material/InputLabel'; + import InputAdornment from '@mui/material/InputAdornment'; -import FormControl from '@mui/material/FormControl'; + import TextField from '@mui/material/TextField'; import AccountCircle from '@mui/icons-material/AccountCircle'; import PhoneIcon from '@mui/icons-material/Phone' import EmailIcon from '@mui/icons-material/Email' import LanguageIcon from '@mui/icons-material/Language'; import HomeIcon from '@mui/icons-material/Home' -import { Button, Form, FormGroup, Label } from "reactstrap"; -import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline'; +import { Button } from "reactstrap"; + import { useHistory } from "react-router-dom"; import TwitterIcon from '@mui/icons-material/Twitter'; import FacebookIcon from '@mui/icons-material/Facebook'; import LinkedInIcon from '@mui/icons-material/LinkedIn'; import axios from "axios"; -import { ConsoleView } from "react-device-detect"; import MenuItem from '@mui/material/MenuItem'; import Checkbox from '@mui/material/Checkbox'; import Partner_Securite_Data from "./Partner_Securite_Data"; @@ -30,7 +28,6 @@ import CancelPresentationIcon from '@mui/icons-material/CancelPresentation'; import { makeStyles } from "@material-ui/core/styles"; import { IconButton } from '@material-ui/core'; -import fileDownload from 'js-file-download'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import Dialog from '@mui/material/Dialog'; import DialogActions from '@mui/material/DialogActions'; @@ -38,10 +35,9 @@ import DialogContent from '@mui/material/DialogContent'; import DialogContentText from '@mui/material/DialogContentText'; import DialogTitle from '@mui/material/DialogTitle'; import ColorPicker from 'react-pick-color'; -import { gridClasses } from '@mui/x-data-grid'; + import AttachFileIcon from '@mui/icons-material/AttachFile'; import Module_Alert_Confirmation from "./Module_Alert_Confirmation"; -import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; import DownloadingIcon from '@mui/icons-material/Downloading'; import Popup from 'reactjs-popup'; @@ -135,6 +131,10 @@ function UpdateParnterInfo(props) { //desablesecurtyInsertKeyfields(); getPartnerImages(); Get_List_Catalog_Public_Themes(); + window.scrollTo({ + top: 0, + behavior: "smooth", + }); }, []) @@ -385,7 +385,7 @@ function UpdateParnterInfo(props) { if (mylocaltraining.adr_city) { - setp_adr_street(mylocaltraining.adr_city); + setp_adr_city(mylocaltraining.adr_city); } diff --git a/src/components/marketplace_automatic_files/new_marketplace_2025.js b/src/components/marketplace_automatic_files/new_marketplace_2025.js index 4d5accb..98a6fd5 100644 --- a/src/components/marketplace_automatic_files/new_marketplace_2025.js +++ b/src/components/marketplace_automatic_files/new_marketplace_2025.js @@ -2978,14 +2978,13 @@ const New_C_Marketplace_2025 = () => {
- -
+
- +
diff --git a/src/mysy_img2/img_jmj_modif.jpg b/src/mysy_img2/img_jmj_modif.jpg new file mode 100644 index 0000000..11a1dc7 Binary files /dev/null and b/src/mysy_img2/img_jmj_modif.jpg differ diff --git a/src/pages/jmjformation_catalogue_public.js b/src/pages/jmjformation_catalogue_public.js index 355ebe1..456a9fd 100644 --- a/src/pages/jmjformation_catalogue_public.js +++ b/src/pages/jmjformation_catalogue_public.js @@ -1,17 +1,19 @@ -import Jmjformation_Catalogue_Public from "../components/Jmjformation_Catalogue_Public"; +import Jmjformation_Catalogue_Public from "../components/Jmj_Theme/Jmjformation_Catalogue_Public"; +import New_C_Footer_2025_V2 from "../components/footer_automatic_files/Layout"; const jmjformation_catalogue_public = () => { return (
- +
+ +
- ) } diff --git a/src/pages/new_p_marketplace_2025.js b/src/pages/new_p_marketplace_2025.js index ac72be9..ecb073e 100644 --- a/src/pages/new_p_marketplace_2025.js +++ b/src/pages/new_p_marketplace_2025.js @@ -1,4 +1,4 @@ -import React from "react"; +import React from "react"; import New_C_Footer_2025_V2 from "../components/footer_automatic_files/Layout"; import New_C_Header_2025_V2 from "../components/header_automatic_files/Header"; diff --git a/src/styles/components/_mon_catalogue_public.scss b/src/styles/components/_mon_catalogue_public.scss index a88af5b..3235ff4 100644 --- a/src/styles/components/_mon_catalogue_public.scss +++ b/src/styles/components/_mon_catalogue_public.scss @@ -17,6 +17,8 @@ font-size: 0.1rem; } + + @media only screen and (max-width: 600px) { .calage { display: none; @@ -392,7 +394,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -928,7 +930,7 @@ .title2 { position: absolute; height: 35px; - font-family: "Albert Sans"; + font-family: 'DM Sans'; font-style: normal; font-size: 14px; line-height: 19px; @@ -1239,7 +1241,7 @@ height: 24px; letter-spacing: 1px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 800; font-size: 18px; @@ -2384,6 +2386,7 @@ width: 100%; float: left; text-align: center; + font-family: "DM Sans"; } .title1_nom_model_2 { @@ -2392,7 +2395,7 @@ text-align: center; height: 150px; - font-family: 'Albert Sans'; + font-family: "DM Sans"; font-style: normal; font-weight: 700; font-size: 40px; @@ -2506,7 +2509,7 @@ text-align: left; // height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 22px !important; @@ -2534,7 +2537,7 @@ text-align: left; //height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-size: 35px; @@ -2900,7 +2903,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -3786,7 +3789,7 @@ text-align: left; // height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-size: 34px; @@ -3805,7 +3808,7 @@ flex: none; order: 0; flex-grow: 0; - height: 100px; + // height: 100px; } .title1_text1 { @@ -3813,7 +3816,7 @@ text-align: left; height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -3840,7 +3843,7 @@ text-align: left; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-size: 16px; @@ -4296,7 +4299,7 @@ height: 24px; letter-spacing: 1px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 800; font-size: 18px; @@ -5702,12 +5705,14 @@ .bloc_logo_indic_contact_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } .bloc_logo_indic_indic_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } /*** Pour le modele 2 - MySy_Theme2 **/ @@ -5726,6 +5731,7 @@ width: 100%; float: left; text-align: center; + font-family: "DM Sans"; } .title1_nom_model_2 { @@ -5734,7 +5740,7 @@ text-align: center; height: 150px; - font-family: 'Albert Sans'; + font-family: "DM Sans"; font-style: normal; font-weight: 700; font-size: 40px; @@ -5841,6 +5847,68 @@ } + .jmj_block_header { + display: flex; + flex-direction: column; + justify-content: flex-start; + width: 100%; + flex-wrap: wrap; + min-height: 100vh; + // padding: 2px; + } + + .jmj_block_header_img { + padding: 2px; + + // min-height: 500px; + background: #f3f4fb; + z-index: -2; + border: none; + padding-top: 15px; + margin-bottom: 1rem; + } + + .jmj_header_gauche { + width: 70%; + float: left; + height: 400px; + } + + .jmj_header_droite { + width: 25%; + float: left; + height: 400px; + } + + .jmj_block_milieu { + display: flex; + flex-direction: row; + justify-content: center; + width: 100%; + flex-wrap: wrap; + margin: auto; + max-width: 1600px; + min-height: 100vh; + gap: 10px; + } + + + .jmj_block_footer { + margin-top: 15px; + min-height: 10rem; + } + + .jmj_block_milieu_gauche { + padding: auto; + width: 100%; + margin-left: auto; + } + + .jmj_block_milieu_droite { + margin: auto; + width: 100%; + } + } @media only screen and (min-width: 992px) and (max-width: 1199px) { @@ -7065,9 +7133,9 @@ .title1_nom { width: 100%; text-align: left; - height: 192px; + // height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-size: 40px; @@ -7091,9 +7159,9 @@ .title1_text1 { width: 100%; text-align: left; - height: 192px; + height: 100%; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -7120,7 +7188,7 @@ text-align: left; height: 22px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-size: 20px; @@ -7577,7 +7645,7 @@ // width: 92px; height: 24px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 800; font-size: 20px; @@ -8963,12 +9031,14 @@ .bloc_logo_indic_contact_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } .bloc_logo_indic_indic_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } /*** Pour le modele 2 - MySy_Theme2 **/ @@ -8987,6 +9057,7 @@ width: 100%; float: left; text-align: center; + font-family: "DM Sans"; } .title1_nom_model_2 { @@ -8994,7 +9065,7 @@ text-align: center; height: 150px; - font-family: 'Albert Sans'; + font-family: "DM Sans"; font-style: normal; font-weight: 700; font-size: 40px; @@ -9125,6 +9196,72 @@ } + + .jmj_block_header { + display: flex; + flex-direction: column; + justify-content: flex-start; + width: 100%; + flex-wrap: wrap; + min-height: 100vh; + // padding: 2px; + } + + .jmj_block_header_img { + padding: 2px; + + // min-height: 500px; + background: #f3f4fb; + z-index: -2; + border: none; + padding-top: 15px; + margin-bottom: 1rem; + } + + .jmj_header_gauche { + width: 70%; + float: left; + height: 400px; + } + + .jmj_header_droite { + width: 25%; + float: left; + height: 400px; + } + + .jmj_block_milieu { + display: flex; + flex-direction: row; + justify-content: center; + width: 100%; + flex-wrap: wrap; + margin: auto; + max-width: 1600px; + min-height: 100vh; + gap: 10px; + } + + + .jmj_block_footer { + margin-top: 15px; + min-height: 10rem; + } + + .jmj_block_milieu_gauche { + padding: auto; + + width: 25%; + min-height: 100vh; + margin-left: auto; + } + + .jmj_block_milieu_droite { + margin: auto; + width: 70%; + min-height: 100vh; + + } } @media only screen and (min-width: 1200px) and (max-width: 1919px) { @@ -9462,7 +9599,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -10351,9 +10488,9 @@ .title1_nom { width: 90%; text-align: left; - height: 192px; + // height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-size: 40px; @@ -10380,7 +10517,7 @@ text-align: left; height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -10406,7 +10543,7 @@ text-align: left; height: 22px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-size: 18px; @@ -10861,7 +10998,7 @@ // width: 92px; height: 24px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 800; font-size: 20px; @@ -12250,12 +12387,14 @@ .bloc_logo_indic_contact_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } .bloc_logo_indic_indic_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } /*** Pour le modele 2 - MySy_Theme2 **/ @@ -12274,6 +12413,7 @@ width: 100%; float: left; text-align: center; + font-family: "DM Sans"; } .title1_nom_model_2 { @@ -12281,7 +12421,7 @@ text-align: center; height: 150px; - font-family: 'Albert Sans'; + font-family: "DM Sans"; font-style: normal; font-weight: 700; font-size: 40px; @@ -12401,7 +12541,7 @@ text-align: left; height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -12435,6 +12575,72 @@ } + + .jmj_block_header { + display: flex; + flex-direction: column; + justify-content: flex-start; + width: 100%; + flex-wrap: wrap; + min-height: 100vh; + // padding: 2px; + } + + .jmj_block_header_img { + padding: 2px; + + // min-height: 500px; + background: #f3f4fb; + z-index: -2; + border: none; + padding-top: 15px; + margin-bottom: 1rem; + } + + .jmj_header_gauche { + width: 70%; + float: left; + height: 400px; + } + + .jmj_header_droite { + width: 25%; + float: left; + height: 400px; + } + + .jmj_block_milieu { + display: flex; + flex-direction: row; + justify-content: center; + width: 100%; + flex-wrap: wrap; + margin: auto; + max-width: 1600px; + min-height: 100vh; + gap: 10px; + } + + + .jmj_block_footer { + margin-top: 15px; + min-height: 10rem; + } + + .jmj_block_milieu_gauche { + padding: auto; + + width: 20%; + min-height: 100vh; + margin-left: auto; + } + + .jmj_block_milieu_droite { + margin: auto; + width: 70%; + min-height: 100vh; + + } } @media only screen and (min-width: 1920px) { @@ -12775,7 +12981,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -13670,9 +13876,9 @@ .title1_nom { width: 100%; text-align: left; - height: 192px; + // height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 700; font-size: 40px; @@ -13698,7 +13904,7 @@ text-align: left; height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -13724,7 +13930,7 @@ text-align: left; height: 22px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 500; font-size: 18px; @@ -14180,7 +14386,7 @@ // width: 92px; height: 24px; - font-family: 'Albert Sans'; + font-family: 'DM Sans'; font-style: normal; font-weight: 800; font-size: 20px; @@ -15593,12 +15799,14 @@ .bloc_logo_indic_contact_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } .bloc_logo_indic_indic_text { text-align: left; font-weight: 700; + font-family: "DM Sans"; } /*** Pour le modele 2 - MySy_Theme2 **/ @@ -15617,6 +15825,7 @@ width: 100%; float: left; text-align: center; + font-family: "DM Sans"; } .title1_nom_model_2 { @@ -15624,7 +15833,7 @@ text-align: center; height: 150px; - font-family: 'Albert Sans'; + font-family: "DM Sans"; font-style: normal; font-weight: 700; font-size: 40px; @@ -15745,7 +15954,7 @@ text-align: left; height: 192px; - font-family: 'Albert Sans'; + font-family: 'DM sans'; font-style: normal; font-weight: 500; font-size: 30px; @@ -15779,12 +15988,87 @@ float: left; } + + .jmj_block_header { + display: flex; + flex-direction: column; + justify-content: flex-start; + width: 100%; + flex-wrap: wrap; + min-height: 100vh; + // padding: 2px; + } + + .jmj_block_header_img { + padding: 2px; + + // min-height: 500px; + background: #f3f4fb; + z-index: -2; + border: none; + padding-top: 15px; + margin-bottom: 1rem; + } + + .jmj_header_gauche { + width: 70%; + float: left; + height: 400px; + } + + .jmj_header_droite { + width: 25%; + float: left; + height: 400px; + } + + .jmj_block_milieu { + display: flex; + flex-direction: row; + justify-content: center; + width: 100%; + flex-wrap: wrap; + margin: auto; + max-width: 1600px; + min-height: 100vh; + gap: 10px; + } + + + .jmj_block_footer { + margin-top: 15px; + min-height: 10rem; + } + + .jmj_block_milieu_gauche { + padding: auto; + + width: 20%; + min-height: 100vh; + margin-left: auto; + } + + .jmj_block_milieu_droite { + margin: auto; + width: 70%; + min-height: 100vh; + + } } // end media + .Partner_Catalog_Background_Header_jmj { + width: 100%; + height: 452px; + left: 0px; + top: 0px; + z-index: -1; + position: absolute; + } + .message_hili { color: #619e31; font-weight: bold; diff --git a/src/styles/components/_mon_intranet_public.scss b/src/styles/components/_mon_intranet_public.scss index c2f744d..d86889f 100644 --- a/src/styles/components/_mon_intranet_public.scss +++ b/src/styles/components/_mon_intranet_public.scss @@ -397,7 +397,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -878,6 +878,7 @@ left: 1%; top: 900px; } + .pieddepage_v2 { position: relative; width: 100%; @@ -2426,9 +2427,9 @@ font-weight: 700; } - /*** Pour le modele 2 - MySy_Theme2 **/ + /*** Pour le modele 2 - MySy_Theme2 **/ - .bloc_milieu_model_2 { + .bloc_milieu_model_2 { min-height: 5rem; width: 90%; margin-left: 5%; @@ -2453,7 +2454,7 @@ font-style: normal; font-weight: 700; font-size: 30px; - // line-height: 54px; + // line-height: 54px; /* or 107% */ letter-spacing: 1px; @@ -2547,33 +2548,31 @@ font-weight: 700; } - - .bloc_milieu_text_model_2_gauche{ + + .bloc_milieu_text_model_2_gauche { width: 100%; float: left; } - .bloc_milieu_text_model_2_centre{ + .bloc_milieu_text_model_2_centre { width: 100%; float: left; height: 250px; } - .bloc_milieu_text_model_2_droite{ + .bloc_milieu_text_model_2_droite { width: 100%; float: right; } - .title1_text1_model_2 { - - } + .title1_text1_model_2 {} .bloc_connexion_model_2 { width: 100%; float: left; height: 70vh; - + } @@ -2921,7 +2920,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -3841,7 +3840,7 @@ flex: none; order: 0; flex-grow: 0; - height: 100px; + height: 100px; } .title1_text1 { @@ -5742,136 +5741,134 @@ text-align: left; font-weight: 700; } - /*** Pour le modele 2 - MySy_Theme2 **/ - .bloc_milieu_model_2 { - min-height: 5rem; - width: 90%; - margin-left: 5%; - float: left; - position: absolute; - top: 10rem; - } + /*** Pour le modele 2 - MySy_Theme2 **/ + + .bloc_milieu_model_2 { + min-height: 5rem; + width: 90%; + margin-left: 5%; + float: left; + position: absolute; + top: 10rem; + } - .bloc_milieu_text_model_2 { - width: 100%; - float: left; - text-align: center; - } + .bloc_milieu_text_model_2 { + width: 100%; + float: left; + text-align: center; + } - .title1_nom_model_2 { + .title1_nom_model_2 { - width: 100%; - text-align: center; - height: 150px; + width: 100%; + text-align: center; + height: 150px; - font-family: 'Albert Sans'; - font-style: normal; - font-weight: 700; - font-size: 40px; - line-height: 54px; - /* or 107% */ + font-family: 'Albert Sans'; + font-style: normal; + font-weight: 700; + font-size: 40px; + line-height: 54px; + /* or 107% */ - letter-spacing: 1px; + letter-spacing: 1px; - /* Deep Blue */ + /* Deep Blue */ - color: #0A043C; + color: #0A043C; - /* Inside auto layout */ + /* Inside auto layout */ - flex: none; - order: 0; - flex-grow: 0; - } + flex: none; + order: 0; + flex-grow: 0; + } - .title2_model_2 { - - } + .title2_model_2 {} - .bloc_img_milieu_gauche { - display: none; - } + .bloc_img_milieu_gauche { + display: none; + } - .Partner_Catalog_Background_Header_model_2 { - // position: absolute; - width: 100%; - height: 380px; - left: 0px; - top: 0px; - } + .Partner_Catalog_Background_Header_model_2 { + // position: absolute; + width: 100%; + height: 380px; + left: 0px; + top: 0px; + } - .bloc_logo_indic_model_2 { - min-height: 5rem; - width: 90%; - margin-left: 5%; - float: left; - position: absolute; - top: 1rem; + .bloc_logo_indic_model_2 { + min-height: 5rem; + width: 90%; + margin-left: 5%; + float: left; + position: absolute; + top: 1rem; + + } + + .bloc_logo_indic_logo_model_2 { + width: 60%; + float: left; + text-align: left; + } + + + .bloc_logo_indic_contact_model_2 { + width: 18%; + float: right; + text-align: right; + } + + + .bloc_logo_indic_indic_model_2 { + width: 18%; + float: left; + } + + .bloc_logo_indic_contact_text_model_2 { + text-align: left; + font-weight: 700; + } + + + .bloc_logo_indic_indic_text_model_2 { + text-align: left; + font-weight: 700; + } + + + .bloc_milieu_text_model_2_gauche { + width: 19%; + float: left; + + } + + .bloc_milieu_text_model_2_centre { + width: 60%; + float: left; + } + + .bloc_milieu_text_model_2_droite { + width: 20%; + float: right; + } + + .title1_text1_model_2 {} + + .bloc_connexion_model_2 { + width: 100%; + float: left; + min-height: 60vh; + margin-top: 3rem; + } } - .bloc_logo_indic_logo_model_2 { - width: 60%; - float: left; - text-align: left; - } - - - .bloc_logo_indic_contact_model_2 { - width: 18%; - float: right; - text-align: right; - } - - - .bloc_logo_indic_indic_model_2 { - width: 18%; - float: left; - } - - .bloc_logo_indic_contact_text_model_2 { - text-align: left; - font-weight: 700; - } - - - .bloc_logo_indic_indic_text_model_2 { - text-align: left; - font-weight: 700; - } - - - .bloc_milieu_text_model_2_gauche{ - width: 19%; - float: left; - - } - - .bloc_milieu_text_model_2_centre{ - width: 60%; - float: left; - } - - .bloc_milieu_text_model_2_droite{ - width: 20%; - float: right; - } - .title1_text1_model_2 { - - } - - .bloc_connexion_model_2 { - width: 100%; - float: left; - min-height: 60vh; - margin-top: 3rem; - } - -} - @media only screen and (min-width: 992px) and (max-width: 1199px) { /*style grande tablettes & Pc portable */ @@ -8993,9 +8990,9 @@ font-weight: 700; } - /*** Pour le modele 2 - MySy_Theme2 **/ + /*** Pour le modele 2 - MySy_Theme2 **/ - .bloc_milieu_model_2 { + .bloc_milieu_model_2 { min-height: 5rem; width: 90%; margin-left: 5%; @@ -9114,26 +9111,24 @@ font-weight: 700; } - - .bloc_milieu_text_model_2_gauche{ + + .bloc_milieu_text_model_2_gauche { width: 19%; float: left; } - .bloc_milieu_text_model_2_centre{ + .bloc_milieu_text_model_2_centre { width: 60%; float: left; } - .bloc_milieu_text_model_2_droite{ + .bloc_milieu_text_model_2_droite { width: 20%; float: right; } - .title1_text1_model_2 { - - } + .title1_text1_model_2 {} .bloc_connexion_model_2 { width: 100%; @@ -9480,7 +9475,7 @@ background: transparent; color: #3b3e40; font-family: "DM Sans", "sans-serif"; - border: 1px solid #C7C9CE; + border: 1px solid #C7C9CE; border-radius: 0.3rem !important; width: 65%; margin-top: 0.3rem; @@ -12270,9 +12265,9 @@ font-weight: 700; } - /*** Pour le modele 2 - MySy_Theme2 **/ + /*** Pour le modele 2 - MySy_Theme2 **/ - .bloc_milieu_model_2 { + .bloc_milieu_model_2 { min-height: 5rem; width: 90%; margin-left: 5%; @@ -12391,24 +12386,24 @@ font-weight: 700; } - - .bloc_milieu_text_model_2_gauche{ + + .bloc_milieu_text_model_2_gauche { width: 19%; float: left; } - .bloc_milieu_text_model_2_centre{ + .bloc_milieu_text_model_2_centre { width: 60%; float: left; } - .bloc_milieu_text_model_2_droite{ + .bloc_milieu_text_model_2_droite { width: 20%; float: right; } - .title1_text1_model_2 { + .title1_text1_model_2 { width: 100%; text-align: left; height: 192px; @@ -13355,6 +13350,10 @@ } + + + + .Partner_Catalog_Background_Header { // position: absolute; width: 100%; @@ -13362,11 +13361,11 @@ left: 0px; top: 0px; - } + .Logo_MySy { width: 108px; height: 36px; @@ -15721,25 +15720,25 @@ font-weight: 700; } - - .bloc_milieu_text_model_2_gauche{ + + .bloc_milieu_text_model_2_gauche { width: 19%; float: left; } - .bloc_milieu_text_model_2_centre{ + .bloc_milieu_text_model_2_centre { width: 60%; float: left; } - .bloc_milieu_text_model_2_droite{ + .bloc_milieu_text_model_2_droite { width: 20%; float: right; } - .title1_text1_model_2 { + .title1_text1_model_2 { width: 100%; text-align: left; height: 192px; @@ -15773,12 +15772,18 @@ } - } // end media - + .Partner_Catalog_Background_Header_jmj { + width: 100%; + height: 452px; + left: 0px; + top: 0px; + z-index: -1; + position: absolute; + } .message_hili { color: #619e31;