/* type */
@media only screen and (min-width:0) and (max-width:767px) {
}
@media only screen and (min-width:768px) and (max-width:999px) {
}
@media only screen and (min-width:1000px) and (max-width: 10000px) {
}



/* HEADER */
/* COMMON HEADER */
@media only screen and (min-width:0) and (max-width: 10000px) {
  body > header .top-menu { top:0; left:0; width:100%; padding-left: 10px; height:124px; background-color:#fff; }
  body > header .logo { padding-top: 19px;}
  body > header .logo img { width:134px; }
  body > header .localisation { position:absolute; font-weight:600; line-height: 1em; text-decoration: none; -webkit-transition: 0.3s; transition: 0.3s;}
  body > header .localisation:before{ content:"\e90d"; }
  body > header .localisation:after{ content:"\e91d";  color:#d8d8d8;}

  body > header .search .select {  float:left; margin-right: -1px; width: 180px;}
  body > header .search .select:before {  border-top-right-radius: 0; border-bottom-right-radius: 0;}
  body > header .search .select select {  border-top-right-radius: 0; border-bottom-right-radius: 0;}
  body > header .search input[type=text] { float:left;   border-radius: 0;}
  body > header .search .button { float:left;border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 0; padding-right: 0; text-align: center; }
  body > header .search .button:before { display: inline-block;  margin-top:-0.1em;vertical-align: middle;}
}

@media only screen and (min-width:0px) and (max-width:767px) {
  body > header { }
  body > header .container { position: relative; padding-top: 96px;}
  body.top-menu-open {overflow-y: hidden; max-height: 100%;}
  body > header .top-menu { position: absolute;  height: 96px;}
  body.top-menu-open > header .top-menu { position:fixed; z-index: 199; margin-left:0px;margin-right:0px;}
  body > header .mobile-menu { position: absolute; top:33px; right:10px; width:30px; height: 30px; }
  body > header .mobile-menu:hover { color:#fff; }
  body > header .mobile-menu:before {  content:"\e90e"; font-size: 30px; color:#29364e; opacity: 1;   -webkit-transition: 0.5s;  transition: 0.5s;}
  body > header .mobile-menu:after {  content:"\e903"; font-size: 28px; margin-left: -30px; margin-top: 2px; opacity: 0; -webkit-transition: 0.5s; transition: 0.5s;}
  body.top-menu-open > header .mobile-menu:before { opacity: 0; }
  body.top-menu-open > header .mobile-menu:after { opacity: 1; }
  body > header .localisation{ top:33px; right:50px; width: 30px;height: 30px; margin: 0 10px; font-size: 0; }
  body > header .localisation:before{ font-size: 30px; color:#29364e; }
  body > header .localisation:after{ display: none; }

  body > header .search { margin-bottom: 10px; width:100%; max-width: 500px;}
  body > header .search .select { width:calc(60px + 30%); }
  body > header .search input[type=text] { width:calc(70% - 40px - 59px);}
  body > header .search .button { width: 40px; height: 40px;}
  body > header .search .button:before { font-size: 20px; }
}
@media only screen and (min-width:768px) and (max-width: 10000px) {
  body > header .container { position: relative;}
  body > header .top-menu { padding-left: 0; }
	body > header .localisation { top:32px; right:10px; font-size: 14px; width:236px; height:50px; padding: 18px 40px; background-color:#fff; border:1px solid #d8d8d8; color:#29364e; border-radius:1px; }
  body > header .localisation:hover { border-color: #29364e; }
  body > header .localisation:before,
  body > header .localisation:after { position: absolute; }
  body > header .localisation:before { font-size: 20px; top:14px; left:10px; }
  body > header .localisation:after { font-size: 18px; top:15px; right:10px; -webkit-transition: 0.3s; transition: 0.3s; }
  body > header .localisation:hover:after { -webkit-transform: scale(1.2); transform: scale(1.2); }
  body > header .search {   width: 410px;}
  body > header .search .select { height: 50px; }
  body > header .search .select select { height: 50px; }
  body > header .search input[type=text] { height: 50px; width:calc(100% - 50px - 179px); }
  body > header .search .button { width: 50px; height: 50px; }
  body > header .search .button:before {  font-size: 22px; }
  body > header:not(.home) .search-cnt { margin-top: -20px; margin-bottom: 20px}
  body > header:not(.home) .search {  max-width: 600px; width: calc(100% - 20px); }
}
@media only screen and (min-width:1000px){
  body > header .localisation { right:0; }
  body > header:not(.home) .search-cnt { position:absolute; top:32px; left:134px; width: calc(100% - 134px - 236px); margin-top: -0px; margin-bottom: 0px }
  body > header:not(.home) .search { margin-top: 45px; max-width: 450px; width: calc(100% - 20px); margin: auto;}
}




/* Header accueil */
@media only screen and (min-width:0) and (max-width: 10000px) {
  body > header.home { background-color:#4f8bc9; color:#fff;   border-bottom: 0;}
  body > header.home .container {  background:url("/images/bg/header-home.jpg") 90% 90% no-repeat; }
  body > header.home .top-menu { height:96px; background-color:#4f8bc9;}

  body > header.home .text { font-family:'Poppins',Arial,sans-serif; font-weight:600; max-width:460px; }
  body > header.home .text p:first-of-type { font-size:30px; line-height:36px; margin-top: 1.2em; margin-bottom: 0em;}
  body > header.home .text p:nth-of-type(2) { font-size:12px; text-align:right; margin:0em;}


  body > header.home .search {}
}

@media only screen and (min-width:0px) and (max-width:767px) {
  body > header.home .container {  height: 100vh; min-height:480px; max-height: 150vw; background-size: 90%; background-position: 70% 95%;}
  body > header.home .mobile-menu:before {  color:white; }
  body > header.home .text { margin-top: 116px}
  body > header.home .text p:first-of-type {  margin-top: 1.2em; margin-bottom: 0.2em;}
  body > header.home .localisation:before{  color:white; }

  body > header.home .search-cnt {  position: absolute; top:96px; width:calc(100% - 20px);}
}
@media only screen and (min-width:0px) and (max-width:360px) {
  body > header.home .text p:first-of-type { font-size:18px; line-height:24px;}
}
@media only screen and (min-width:361px) and (max-width:529px) {
  body > header.home .text p:first-of-type { font-size:22px; line-height:28px;}
}
@media only screen and (min-width:768px) and (max-width: 10000px) {
  body > header.home .container {  height: calc(750px - 20vw); max-height: 600px}
  body > header.home .search { margin-top: 45px; width: 500px;}
}
@media only screen and (min-width:1000px){
  body > header.home .container { height: 350px; }
  body > header.home .search { margin-top: 45px; width: 430px;}
}





/* NAV */
@media only screen and (min-width:0) and (max-width: 10000px) {
  body > nav  {  text-align:center; background-color:#4f8bc9; -webkit-transition: 0.5s; transition: 0.5s;}
  body > nav > .container > ul > li { display:inline-block;-webkit-transition: 0.3s;transition: 0.3s;}
  body > nav > .container > ul > li a { font-family:'Poppins',Arial,sans-serif; font-weight:600; color:#fff;  text-decoration:none; }
}

@media only screen and (min-width:0px) and (max-width:767px) {
  body > nav { position: fixed; top:96px; left:0px; width: 100%; height: calc(100% - 96px); max-height: 0px; overflow: hidden;  }
  body.top-menu-open > nav { z-index: 200; max-height: calc(100vh - 96px); border-bottom:1px solid #d8d8d8;}
  body > nav > .container > ul {padding: 20px 0px;}
  body > nav > .container > ul > li { padding: 10px 0; display: block; margin:0 14px; }
}
@media only screen and (min-width:768px){
  body > nav > .container > ul > li a { opacity:1; height:50px; line-height:50px;  -webkit-transition: 0.3s;  transition: 0.3s;}
  body > nav > .container > ul > li a:hover {  opacity:0.8;}
}
@media only screen and (min-width:768px) and (max-width:999px) {
  body > nav > .container > ul > li { margin:0 13px; }
	body > nav > .container > ul > li a { font-size:16px; }
}
@media only screen and (min-width:1000px) and (max-width: 10000px) {
  body > nav > .container > ul > li { margin:0 25px; }
	body > nav > .container > ul > li a { font-size:18px; }
}

/* NAV accueil */
@media only screen and (min-width:0) and (max-width: 10000px) {
  body > nav.home  { background-color:#fafafa;}
  body > nav.home > .container > ul > li a {color:#29364e; }
}

@media only screen and (min-width:768px){
  body > nav.home {  border-bottom:1px solid #d8d8d8; }
  body > nav.home > .container > ul > li a {  height:70px; line-height:70px;  -webkit-transition: 0.3s;  transition: 0.3s;}
  body > nav.home > .container > ul > li a:hover {  color:#4f8bc9;  opacity:1; }
}

/* HOME */
@media only screen and (min-width:0) and (max-width: 10000px) {
	#page.home { padding-top:20px; padding-bottom: 70px}
	#page.home .concept { margin-top:50px; text-align:center; }
	#page.home .concept .h1 { text-align:center; }
	#page.home .concept ul { margin-bottom:20px; }
	#page.home .concept ul h2::before { display:block; height:90px; color:#4f8bc9; font-size:62px; }
	#page.home .concept ul h2.icon-research-home::before { padding-top:10px; font-size:42px; }
	#page.home .concept ul h2 { text-align:center; margin-bottom:25px; }
}

@media only screen and (min-width:0) and (max-width:767px) {
	#page.home { padding-top:10px;}
	#page.home .banners-big > li, #page.home .banners-small > li { display:block; margin-bottom:12px ; }
	#page.home .banners-big > li img, #page.home .banners-small > li img { width:100%;  height: auto;}
	#page.home .concept .h1 { margin-bottom:40px; }
	#page.home .concept ul li p { max-width: 320px; margin: auto;}
}
@media only screen and (min-width:768px) and (max-width: 10000px) {
	#page.home .banners-big { margin-bottom:20px; }
	#page.home .banners-big > li { float:left; width:calc(50% - 10px); }
	#page.home .banners-big > li:first-child { margin-right:20px; }
	#page.home .banners-big > li img { width:100%; max-width:100%; height:auto; }
	#page.home .banners-small > li { float:left; width:calc( 33.33% - 13.33px); }
	#page.home .banners-small > li:not(:last-child) { margin-right:20px; }
	#page.home .banners-small > li img { width:100%; max-width:100%; height:auto;  }
	#page.home .concept .h1 { margin-bottom:60px; }
	#page.home .concept ul > li { float:left; width:calc( 33.33% - 13.33px); }
	#page.home .concept ul > li:not(:last-child) { margin-right:20px; }
}


/* CONTENT PAGES */
/* INFO PAGE */
@media only screen and (min-width:0) and (max-width: 10000px) {
	#page.content-page .content .search-explain { background: #4f8bc9; padding: 30px; margin-top: 50px;}

	#page.content-page .content .search-explain .pic { text-align: center; }
	#page.content-page .content .search-explain .pic img {margin-left: auto; margin-right: auto;}
	#page.content-page .content .search-explain .pic .localisation { position: relative; text-align: left; cursor: auto; display: block; margin-top: -8px; font-weight:600; line-height: 1em; text-decoration: none;   font-size: 14px; width: 100%; max-width:236px; height:50px; padding: 18px 40px; margin-left: auto; margin-right:auto; background-color:#fff; border:1px solid #d8d8d8; color:#29364e; border-radius:1px; }
	#page.content-page .content .search-explain .pic .localisation:before,
	#page.content-page .content .search-explain .pic .localisation:after { position: absolute; }
	#page.content-page .content .search-explain .pic .localisation:before{ content:"\e90d"; border-color: #29364e; font-size: 20px; top:14px; left:10px; }
	#page.content-page .content .search-explain .pic .localisation:after{ content:"\e91d";  color:#d8d8d8; font-size: 18px; top:15px; right:10px; -webkit-transition: 0.3s; transition: 0.3s;}

	#page.content-page .content .search-explain .text { }
	#page.content-page .content .search-explain .text .h2 { color:#fff; margin-top: 0; margin-bottom: 15px;}
	#page.content-page .content .search-explain .text .small-info { color:#fff; font-size: 12px; line-height: 16px;}

	#page.content-page .content .qualities { margin-top:20px; text-align:center; }
	#page.content-page .content .qualities ul { margin-bottom:20px; }
	#page.content-page .content .qualities ul h2::before { display:block; height:90px; color:#4f8bc9; font-size:62px; }
	#page.content-page .content .qualities ul h2.icon-glasses2::before { font-size:80px; line-height: 70px;}
	#page.content-page .content .qualities ul h2.icon-pigbank::before { -webkit-transform: scaleX(-1); transform: scaleX(-1);}
	#page.content-page .content .qualities ul h2 { text-align:center; margin-bottom:25px; }
}
@media only screen and (min-width:0) and (max-width:767px) {
	#page.content-page .content .search-explain .pic { margin-bottom: 30px;}
	#page.content-page .content .search-explain .text { text-align: center;}
	#page.content-page .content .qualities ul li p { max-width: 320px; margin: auto;}

}
@media only screen and (min-width:768px) and (max-width: 10000px) {
	#page.content-page .content .search-explain .pic { float: left; width: calc(50% - 15px); margin-right: 30px;}
	#page.content-page .content .search-explain .text { float: left; width: calc(50% - 15px);}

	#page.content-page .content .qualities ul > li { float:left; width:calc((100% - 40px)/3); }
	#page.content-page .content .qualities ul > li:not(:last-child) { margin-right:20px; }
}

/* HOW IT WORKS */
@media only screen and (min-width:0) and (max-width: 10000px) {
	#page.content-page .content .guide-steps { margin-left: -70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }
	#page.content-page .content .guide-steps .guide-step { -webkit-box-flex:1; -ms-flex:1; flex:1; min-width: 280px; margin-left: 70px; margin-bottom: 50px;}
	#page.content-page .content .guide-steps .guide-step .nbr { font-size: 60px; line-height:60px; font-family:'Poppins', Arial, sans-serif; font-weight:600; color:#29364e; margin-bottom: 15px;}
	#page.content-page .content .guide-steps .guide-step .text { font-size: 16px; line-height:24px; color:#4d6066;}
	#page.content-page .content .guide-steps .guide-step .text .highlight { font-size: 24px; line-height:34px; font-family:'Poppins', Arial, sans-serif; font-weight:600; color:#4f8bc9;}
}
@media only screen and (min-width:0) and (max-width:767px) {
	#page.content-page .content .guide-steps .guide-step {  margin-bottom: 30px;}
	#page.content-page .content .guide-steps .guide-step .nbr {  margin-bottom: 10px;}
}


/* Autocomplete par category */
.ui-autocomplete-category { padding-left:5px; font-weight:bold; text-transform:uppercase; background-color:#000; }