@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400);
[class*="col-"] {
  padding-top: 15px;
  padding-bottom: 15px;
    /*background-color: #eee;
    background-color: rgba(86,61,124,.15);
    border: 1px solid #ddd;
    border: 1px solid rgba(86,61,124,.2);*/
    
  }
  a:link, a:visited
  {color:grey;
    text-decoration: none;}

    a:hover, a:active
    {color:#f2956a;
      text-decoration: none;}

      p {text-align:center;

      }

      h3 {text-align:center;
        color:#f2956a;

      }

      h2
      {
        font-size:18px;
        text-transform: uppercase;
        text-align: center;
      }


      input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
        color: #aca49c;
        font-size: 0.875em;
      }

      input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
        color: #bbb5af;
      }

      input::-moz-placeholder, textarea::-moz-placeholder {
        color: #aca49c;
        font-size: 0.875em;
      }

      input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
        color: #bbb5af;
      }

      input::placeholder, textarea::placeholder {
        color: #aca49c;
        font-size: 0.875em;
      }

      input:focus::placeholder, textarea::focus:placeholder {
        color: #bbb5af;
      }

      input::-ms-placeholder, textarea::-ms-placeholder {
        color: #aca49c;
        font-size: 0.875em;
      }

      input:focus::-ms-placeholder, textarea:focus::-ms-placeholder {
        color: #bbb5af;
      }

      /* on hover placeholder */

      input:hover::-webkit-input-placeholder, textarea:hover::-webkit-input-placeholder {
        color:#f2956a;
        font-size: 0.875em;
      }

      input:hover:focus::-webkit-input-placeholder, textarea:hover:focus::-webkit-input-placeholder {
        color: #f2956a;
      }

      input:hover::-moz-placeholder, textarea:hover::-moz-placeholder {
        color: #e2dedb;
        font-size: 0.875em;
      }

      input:hover:focus::-moz-placeholder, textarea:hover:focus::-moz-placeholder {
        color: #cbc6c1;
      }

      input:hover::placeholder, textarea:hover::placeholder {
        color: #e2dedb;
        font-size: 0.875em;
      }

      input:hover:focus::placeholder, textarea:hover:focus::placeholder {
        color: #cbc6c1;
      }

      input:hover::placeholder, textarea:hover::placeholder {
        color: #e2dedb;
        font-size: 0.875em;
      }

      input:hover:focus::-ms-placeholder, textarea:hover::focus:-ms-placeholder {
        color: #cbc6c1;
      }

      body {
        font-family: 'Lato', sans-serif;
        color: #b3aca7;
      }

      header {
        position: relative;
        margin: 100px 0 25px 0;
        font-size: 2.3em;
        text-align: center;
        letter-spacing: 7px;
      }

      #form {
        position: relative;
        width: 400px;
        margin: 10px auto 200px auto;
      }

      input {
        font-family: 'Lato', sans-serif;
        font-size: 0.875em;
        width: 400px;
        height: 50px;
        padding: 0px 15px 0px 15px;

        background: transparent;
        outline: none;
        color: #726659;

        border: solid 1px #f2956a;
        border-bottom: none;

        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
      }

      input:hover {
        color: #f2956a;
      }

      textarea {
        width: 400px;
        max-width: 400px;
        height: 110px;
        max-height: 110px;
        padding: 15px;

        background: transparent;
        outline: none;

        color: #726659;
        font-family: 'Lato', sans-serif;
        font-size: 0.875em;

        border: solid 1px #f2956a;

        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
      }

      textarea:hover {
        color: #f2956a;
      }

      #submit {
        width: 400px;

        padding: 0;
        margin: -5px 0px 0px 0px;

        font-family: 'Lato', sans-serif;
        font-size: 0.875em;
        color: #b3aca7;

        outline:none;
        cursor: pointer;

        border: solid 1px #f2956a;
        border-top: none;
      }

      #submit:hover {
        color: #f2956a;
      }
      h1
      {color:white;
        font-size:18px;
      }


      .footer 
      {display:block;
        background-color:#585858;
        width: auto;
      }

      hr
      {

       border-color:#f2956a;
     }


     .menu {
      height: 70px;
      width: 70px;
      right: 70px;
      top: 20px;
      text-align: center;
      position: absolute;
      background: #F2956A;
      overflow: hidden;
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
      z-index: 999;
    }
    .menu.active {
      width: calc(100% - 140px);
    }
    .menu.active .menuContent * {
      opacity: 1;
    }
    .menu.active span i:nth-child(1) {
      -webkit-transform: rotate(-45deg) translate(-50%, -50%);
      transform: rotate(-45deg) translate(-50%, -50%);
      top: 50%;
    }
    .menu.active span i:nth-child(2) {
      -webkit-transform: translateX(-100px);
      transform: translateX(-100px);
      opacity: 0;
    }
    .menu.active span i:nth-child(3) {
      -webkit-transform: rotate(45deg) translate(-50%, -50%);
      transform: rotate(45deg) translate(-50%, -50%);
      top: 50%;
    }
    .menu span {
      width: 70px;
      height: 70px;
      position: absolute;
      right: 0;
      cursor: pointer;
      background: #F2956A;
      z-index: 1;
    }
    .menu span i {
      position: absolute;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      width: 45%;
      height: 2px;
      left: 0;
      right: 0;
      margin: auto;
      background-color:white;
      -webkit-transition: opacity .1s ease .1s, -webkit-transform .3s ease;
      transition: opacity .1s ease .1s, -webkit-transform .3s ease;
      transition: transform .3s ease, opacity .1s ease .1s;
      transition: transform .3s ease, opacity .1s ease .1s, -webkit-transform .3s ease;
    }
    .menu span i:nth-child(1) {
      top: 40%;
    }
    .menu span i:nth-child(2) {
      top: 50%;
    }
    .menu span i:nth-child(3) {
      top: 60%;
    }
    .menu .menuContent {
      position: absolute;
      width: 100%;
      height: 100%;
      line-height: 70px;
      right: 0px;
      text-align: center;
    }
    .menu .menuContent * {
      opacity: 0;
    }
    .menu .menuContent ul li {
      display: inline-block;
      margin-left: 50px;
      margin-right: 50px;
      color: white;
      -webkit-transition: opacity .3s ease .3s;
      transition: opacity .3s ease .3s;
      cursor: pointer;
      position: relative;
    }
    .menu .menuContent ul li:hover:before {
      opacity: .8;
      top: 13px;
      left: 20px;
    }
    .menu .menuContent ul li:hover:after {
      opacity: .8;
      bottom: 13px;
      left: -20px;
    }
    .menu .menuContent ul li:before, .menu .menuContent ul li:after {
      content: "";
      position: absolute;
      width: 20px;
      height: 2px;
      background: #cccccc;
      -webkit-transition: all .3s ease;
      transition: all .3s ease;
    }
    .menu .menuContent ul li:before {
      -webkit-transform: rotate(-55deg);
      transform: rotate(-55deg);
      left: 60px;
      top: -30px;
      opacity: 0;
      right: 0;
      margin: auto;
    }
    .menu .menuContent ul li:after {
      -webkit-transform: rotate(-55deg);
      transform: rotate(-55deg);
      left: -60px;
      bottom: -30px;
      opacity: 0;
      right: 0;
      margin: auto;
    }

    .colorfond
    {display:block;
      background-color:gray;
    }

    * {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
   }
   .container{
     max-width:1000px;
     margin:0 auto;
     min-height: 800px;
   }


   .image 
   {
     display: block;
     margin-left: auto;
     margin-right: auto;
     width:166px ;
     height:204px;

   }

