.footer-top
{
    display: block;
    float:left;
    width: 100%;
    background-color:#f5f3f0 ;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
}

.footer-topwrapper
{
    width: 1160px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top:60px;
    background-image: url("./images/Peroquet_agrandit.png"); /* The image used */
    background-color: #f5f3f0; /* Used if the image is unavailable */
    background-position: 20% center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: auto; /* Resize the background image to cover the entire container */


    height: 360px;
}

.footer-top .blocorange
{
    display: block;
    float:left;
    width: 365px;
    height: 260px;
    background-color:#d64226 ;
    color:#ffffff;
    font-family: LibreFranklin;
    font-size: 1.125rem;
    padding: 20px;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top:35px;
    margin-bottom:60px;
    mix-blend-mode: multiply;
}

.footer-top .blocorange pre
{
    font-family: LibreFranklin;
    font-size:1.9rem;
    margin:0;
}

.footer-top .blocorange a:link,
.footer-top .blocorange a:visited
{
    color: #ffffff;
    font-family: Barlow;
    font-size: 1.0rem;
    text-decoration: underline;
    text-underline-offset: 6px;
    text-transform: uppercase;
    line-height: 2;
}

.footer-top .blocvert
{
    display: block;
    float:right;
    width: 565px;
    height: 260px;
    background-color:rgba(0,117,106,1) ;
    mix-blend-mode: multiply;
    color:#ffffff;
    font-family: LibreFranklin;
    font-size: 1.125rem;
    padding-top: 35px;
    padding-bottom: 45px;
    padding-left: 95px;
    padding-right: 55px;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    margin-top:35px;
    margin-bottom:60px;
    line-height: 24px;;

}

.footer-top .blocvert h2
{
    font-family: LibreFranklin;
    font-size: 1.25rem;
    font-weight: bold;
    color: #ffffff;
    width: 100%;
    margin-top: 0;
}

.footer-top .blocvert .form-newsletter input.param
{
    width: 275px;
    height: 45px;
    background-color: #ffffff;
    color:rgba(0, 0, 0, 0.9);
    font-family: LibreFranklin;
    font-size: 0.9rem;
    border:none;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    float: left;
    display: block;

}

.footer-top .blocvert .form-newsletter input::-webkit-input-placeholder,
.footer-top .blocvert .form-newsletter input::-moz-placeholder,
.footer-top .blocvert .form-newsletter input::-ms-input-placeholder,
.footer-top .blocvert .form-newsletter input::placeholder
{
    color:rgba(0, 0, 0, 0.6);
    font-family: LibreFranklin;
    font-size: 0.9rem;
}

.footer-top .blocvert .form-newsletter input.sendbutton
{
    width: 90px;
    height: 45px;
    background-color: transparent;
    color:#ffffff;
    font-family: Barlow;
    font-size: 1.125rem;
    border:none;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 10px;
    border:solid 2px #ffffff;
    float: left;
    display: block;  
}

.block-footerbottomtextblock-block
{
  padding: 20px;
  display: block;
  float: left;
  width: 615px;
  color:#ffffff;
  font-family: Barlow;
  font-size: 1.0rem;
  line-height: 1.5;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.block-footerbottomtextblock-block h2
{
    color:#ffffff;
    font-family: Arvo;
    font-size: 1.25rem;
    width: 100%;
    margin-top:0;
}

.block-footerbottomtextblock-block a:link,
.block-footerbottomtextblock-block a:visited
{
    color:#ffffff;
    font-family: Barlow;
    font-size: 1.0rem;
    text-transform: uppercase;
    text-decoration: underline;
    text-underline-offset: 10px;
}

.block-reseauxblock-block
{
  padding: 20px;
  display: block;
  float: left;
  width: 375px;
  color:#ffffff;
  font-family: Barlow;
  font-size: 1.0rem;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.block-reseauxblock-block h2
{
    color:#ffffff;
    font-family: Arvo;
    font-size: 1.25rem;
    width: 100%;
    margin-top:0;
}

.social-list ul
{
    list-style: none;
    width: 100%;
    display: block;
    float:left;
    padding-left: 0;
}

.social-list ul li
{
    display: block;
    float:left;
    height: 35px;
    width: 45px;
}


.copyright 
{
	display: block;
	width: 100%;
	text-align: center;
	color: #ffffff;
	font-family: Barlow;
	font-size: 1.0rem;
	font-weight: normal;
	text-transform: uppercase;
	float: left;
	padding-top: 10px;
    margin:0;
}





.menueditorial 
{
	display: block;
	float: left;
	width: 210px;
	height: auto;
    /*max-height: calc( 100vh - 380px );*/ /*vh =percent of viewport height*/
	background-color: #f5f3f0;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 15px;
	padding-right: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-left: 20px;
	margin-bottom: 20px;
}

.menueditorialwrapper
{
	display: block;
	float: left;
	width: 185px;
	height: 100%;
    max-height: calc( 100vh - 500px );/*vh =percent of viewport height*/
    position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    margin-top: 10px;
}

.menueditorial .jspVerticalBar {
	width: 8px;
    background: #fff;
}

.menueditorial .jspTrack {
    background: #fff;

}

.menueditorial .jspDrag {
    background: #1f8292;

}

.menueditorial .meditbutton
{
    display: block;
    float: left;
    border: none;
    display: block;
    float: left;
    width: 100%;
    color: #1b1b1b;
    text-decoration: none;
    font-family: Barlow;
    font-size: 1.0rem;
    font-weight: bold;
    background-color: transparent;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.menueditorial .meditbutton[aria-hidden=true]
{
    display: none;
}

.menueditorial .menueditorialwrapper[aria-hidden=true]
{
    display: none;
}

.menueditorial span,
.menueditorial a:link, 
.menueditorial a:visited
{
	display: block;
	float: left;
	width: 175px;
	color: #1b1b1b;
	text-decoration: none;
	font-family: Barlow;
	font-size: 1.0rem;
	font-weight: bold;
}

.menueditorial a:link::before {
    content: "";
    display: block;
    background-color: #1f8292;
    width: 8px;
    height: 2px;
    float: left;
    margin-right: 5px;
    margin-top: 10px;
}
.menueditorial ul.menu a:link::before 
{
    background-color: transparent;
    width: 0;
    height: 0;
    display: none;
}

.menueditorial ul.menu {
	margin: 0;
	padding: 0;
	display: block;
	float: left;
    width: 175px;
    height: auto;
    padding-left: 20px;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.menueditorial ul.menu ul.menu 
{
	display: none;
}

.menueditorial ul.menu li {
	display: block;
	float: left;
	width: 100%;
	padding-right: 0;
	padding-left: 0;
	padding-top: 0;
	padding-left: 5px;
	margin-top: 10px;
	margin-bottom: 0;
	margin-left: 0;
    margin-right: 0;
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.menueditorial ul.menu li span,
.menueditorial ul.menu li a:link, 
.menueditorial ul.menu li a:visited
{
	display: block;
	float: left;
	width: 100%;
	color: #1b1b1b;
	text-decoration: none;
	font-family: Barlow;
	font-size: 1.0rem;
	font-weight: normal;
}

.menueditorial ul.menu li span.is-active,
.menueditorial ul.menu li a.is-active:link, 
.menueditorial ul.menu li a.is-active:visited
{
  font-weight: bold;
}

.menueditorial button.meditbutton img {
	float: right;
	margin-top: 6px;
}


@media (max-height: 750px) 
{
    .menueditorialwrapper {
        max-height: 250px;
    }
}