.footer {
    bottom:0;
    width:100%;
    background-color: #246eb2;
}
// background-color: #1791b8; #246eb2


.footer p {
    color: #fff;
    style='font-style:italic';
    display: inline-block;
}


.box{

  margin:25px;
  width:250px;
  height:250px;
  background:#fff;
  border: solid black;
  border-color: black;
  float:left; 
}

.box2{
  width:270px;
  border-width: 3px 3px 5px 5px;
  border-radius:4% 95% 6% 95%/95% 4% 92% 5%;
  transform: rotate(-2deg);
  

}


.oddboxinner{
  margin:15px;
  transform: rotate(-2deg);
}
.evenboxinner{
  transform: rotate(2deg);
  margin:15px;
  padding:0 5px;
  float:right;
  background:#fff;
 
}



#ftr-wrap > div:nth-child(1) {text-align:center;}
#ftr-wrap > div:nth-child(2) {text-align:center;}
#ftr-wrap > div:nth-child(3) {text-align:right;}

#ftr-wrap {
    display:table;
    table-layout:fixed;
    width:100%;
    margin:0 auto;
}
#ftr-wrap > div {
    display:table-cell;
    vertical-align:middle;
}

.ftr-links ul {
    padding: 0;
}
.ftr-links ul li {
    display: inline-block;
    padding-right: 15px;
   
}
.ftr-links ul li a {
    color: #fff;
    margin: 0;
}


/// le Header


*{
  margin: 0;
  padding: 0;
  text-decoration: none;
  font-family: "Open Sans",sans-serif;
}

header{
  height: 90px;
  background: #2f3640;
}

.inner-width{
  max-width: 1000px;
  padding: 0 10px;
  margin: auto;
}

.logo{
  float: left;
  padding: 15px ;

}

.logo img{
  height: 100px;
}

.navigation-menu{
  float: right;
  display: flex;
  align-items: center;
  min-height: 90px;
}

.navigation-menu a{
  margin-left: 10px;
  color: #ddd;
  text-transform: uppercase;
  font-size: 14px;
  padding: 12px 20px;
  border-radius: 4px;
  transition: .3s linear;
}

.navigation-menu a:hover{
  background: #fff;
  color: #2f3640;
  transform: scale(1.1);
}

.navigation-menu i{
  margin-right: 8px;
  font-size: 16px;
}

.home{
  color: #ff6b6b;
}

.about{
  color: #0abde3;
}

.works{
  color: #feca57;
}

.team{
  color: #5f27cd;
}

.contact{
  color: #1dd1a1;
}

.menu-toggle-btn{
  float: right;
  height: 90px;
  line-height: 90px !important;
  color: #fff;
  font-size: 26px;
  display: none !important;
  cursor: pointer;
}

.navigation-menu a{
    display: block;
    margin: 10px 0;
  }

 
@media screen and (max-width:700px) {
  .menu-toggle-btn{
    display: block !important;
  }

  .navigation-menu{
    position: fixed;
    width: 100%;
    max-width: 400px;
    background: #172b4d;
    top: 115px;
    right: 0;
    display: none;
    padding: 20px 40px;
    box-sizing: border-box;
  }

  .navigation-menu::before{
    content: "";
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #172b4d;
    position: absolute;
    top: -10px;
    right: 10px;
  }

  .navigation-menu a{
    display: block;
    margin: 10px 0;
  }

  .navigation-menu.active{
    display: block;
  }
}