/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (max-width: 900px) {
	div.wrapper > section.header > div.mobile-bkg,
	div.wrapper > section.fixed-menu > div.fixed.menu > div.mobile { display: block; }
	div.wrapper > section.header > div.desktop-bkg,
	div.wrapper > section.header > video.video-bkg,
	div.wrapper > section.header > div.controls,
	div.wrapper > section.fixed-menu > div.fixed.menu  > div.menu > ul.menu > div.search,
	div.wrapper > section.fixed-menu > div.fixed.menu > div.menu > ul.menu > li:not(.logo),
	div.wrapper > section.content > section > div.background_image.desktop { display: none; }

	div.wrapper > section.content > section { padding: 8rem 1.3rem; }

	div.wrapper > section.content > section > div.background_image.mobile { display: block; }

	div.wrapper > section.header > div.header.content > div.single > div.top > div.top-content > div.read { font-size: 3rem; }
	
	div.wrapper > section.header > div.header.content > div.header.logo > p > img { width: 58%; }

	div.wrapper > section.header > div.header.content > div.header.down > div.header.subtitle > p:not(.capital) { font-size: 2.4rem; line-height: 3rem; }
	div.wrapper > section.header > div.header.content > div.header.down > div.header.subtitle > p.capital { font-size: 4rem; line-height: 5rem; }
	div.wrapper > section.header > div.header.content > div.header.down > div.header.slogan { display: none; }

	div.wrapper > section.content > section.whoweare > div.whoweare > div.bottom > ul.valeurs  > li.valeur > div.text { padding-bottom: 4rem; }

	div.wrapper > section.content > section > div.background_image > div.title > h1 { font-size: 1.8rem; }
	div.wrapper > section.content > section.ourworks > div.ourworks > div.subs > a.filter { display: block; margin: 0 0 2rem 0; }
	div.wrapper > section.content > section.ourworks > div.ourworks > div.posts > ul.works > li.work.show > div.block > div.picture > img { filter: brightness(.6); transition: .3s; }
	div.wrapper > section.content > section.ourworks > div.ourworks > div.posts > ul.works > li.work.show > div.block > div.picture > div.hover { opacity: 1; transition: .3s; }

	div.wrapper > section.content > section.opinions > div.opinions > div.content > ul.opinions.slider > li.opinion { width: 80%; }

	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill > div.block > div.hover > div.list { width: 100%; }
	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill > div.block > div.hover > div.list > ul { width: calc(100% - 4rem); top: 100%; right: 50%; text-align: center; transform: translate( 50%, 100%); transition: .6s; }
	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill > div.block > div.picture > h5 { max-width: 100%; transition: .6s; }
	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill.show > div.block > div.picture > h5 { max-width: 100%; width: calc(100% - 4rem); left: 50%; top: 10%; transform: translate(-50%, -50%); color: rgba(149,180,71,1); opacity: 0.3; font-size: 4rem; hyphens: auto; line-height: 4rem; transition: .6s; }
	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill.show > div.block > div.hover { opacity: 1; transition: .6s; }
	div.wrapper > section.content > section.skills > div.skills > div.blocks > ul.skills > li.skill.show > div.block > div.hover > div.list > ul { transform: translate( 50%, calc(-100% - 4rem) ); transition: .6s; }

	div.wrapper > section.content > section.expertises > div.expertises > div.blocks { background-position: 0 0; background-repeat: no-repeat; background-size: 100% auto; padding-top: 20rem; position: initial; }
	div.wrapper > section.content > section.expertises > div.expertises > div.blocks > ul.expertises { list-style: none; text-align: left; position: initial; transform: translate(0, 0); }

	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact { float: left; clear: left; transition: .4s; }
	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact > li.question { background: rgba(240,240,240,0); padding: 0; margin: 1rem 0; height: auto; float: left; clear: left; transition: .4s; }
	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact > li.question > div.question { height: auto; line-height: 2.4rem; background: rgba(240,240,240,1); transition: .4s; }
	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact > li.question > a.answer { width: 100%; text-align: center; display: block; transition: .4s; }
	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact > div.contact-form { height: 100%; transition: .4s; }
	div.wrapper > section.content > section.contact > div.contact > div.content > ul.contact > div.contact-form div.right p.element > label { width: 100%; }

	div.wrapper > section.content > section.contact > div.maps { float: left; clear: both; width: 100%; }

	div.wrapper > section.content > section.single > article div.reliable-posts { padding: 0 1.3rem; }

	div.wrapper > section.footer { padding: 6rem 1.3rem; }
}

/* Larger than tablet */
@media (max-width: 1199px) {
	div.wrapper > section.content > section { padding: 8rem 1.3rem; }
	div.wrapper > section.footer { padding: 6rem 1.3rem; }
	div.wrapper > section.header > div.mobile-bkg,
	div.wrapper > section.fixed-menu > div.fixed.menu > div.mobile { display: block; }
	div.wrapper > section.fixed-menu > div.fixed.menu > div.mobile { position: absolute; }
}

/* Larger than desktop */
@media (min-width: 1080px) and (max-width: 1400px) {
	.large-row { max-width: 1100px; }
}


/*
     FILE ARCHIVED ON 06:03:15 May 23, 2020 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 09:24:40 Jun 30, 2025.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  captures_list: 0.92
  exclusion.robots: 0.057
  exclusion.robots.policy: 0.041
  esindex: 0.016
  cdx.remote: 17.974
  LoadShardBlock: 67.75 (3)
  PetaboxLoader3.datanode: 100.267 (4)
  load_resource: 272.78
  PetaboxLoader3.resolve: 204.755
*/