
/*------------------------------------------------------------------------------*/
/*Mobile Version------------------------------------------------------------------*/
/*------------------------------------------------------------------------------*/

footer {background: #4a1b57; height: 100%; }
footer ul {margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
footer li .nav-footer{list-style-type: none; display: inline-block; padding: 15px 20px; border: 1px solid #8ad2dc; color: #8ad2dc;margin-bottom: 15px;}
footer .social-block-footer h4{  color: #8ad2dc; font-size: 15px; letter-spacing: 0.05em; padding-bottom: 15px;}
.footer {background: #4a1b57; height: 100%; padding: 25px 30px 70px 30px;}



/*------------------------------------------------------------------------------*/
/*TABLETTE Version---------------------------------------------------------------*/
/*------------------------------------------------------------------------------*/

@media(min-width:768px) and (max-width: 992px){

  footer { z-index: 100; position: relative;}
  footer ul {list-style-type: none;}
  .footer {display: flex; flex-direction: row-reverse; justify-content: space-between; padding: 30px 0; }
  .footer-nav ul {justify-content: flex-start;}
  .footer-nav li { padding-right: 20px;}

  a.ff-footer, a.ff-footer:hover {text-decoration: none;}
  footer .social-block-footer h4 {padding-bottom: 15px;}

  .social-block-footer { padding-right: 10px;}
  .ff-footer {font-size: 40px; list-style-type: none;}
  .footer-nav {display: flex; flex-direction: row; padding-right: 0px; padding-left: 45px; }

}

/*------------------------------------------------------------------------------*/
/*DESKTOP Version---------------------------------------------------------------*/
/*------------------------------------------------------------------------------*/


@media(min-width:992px) {

  footer { z-index: 100; position: relative;}
  footer ul {list-style-type: none;}
  footer .social-block-footer h4 {padding-bottom: 15px;}
  .footer {display: flex; flex-direction: row-reverse; justify-content: space-between; padding: 30px 0; }
  .footer-nav {display: flex; flex-direction: row; padding-right: 200px; padding-left: 45px; }
  .footer-nav ul {justify-content: flex-start;}
  .footer-nav li { padding-right: 20px;}
  .social-block-footer { padding-right: 110px;}
  a.ff-footer, a.ff-footer:hover {text-decoration: none;}

}
