/*//////////////////////////////////////////////////////////////////

  [ FONT ]*/



  @font-face {

    font-family: Montserrat-Regular;

    src: url('../fonts/montserrat/Montserrat-Regular.ttf'); 

  }



  @font-face {

    font-family: Montserrat-Regular;

    src: url('../fonts/montserrat/Montserrat-Regular.ttf'); 

  }



  @font-face {

    font-family: Montserrat-ExtraBold;

    src: url('../fonts/montserrat/Montserrat-ExtraBold.ttf'); 

  }



  @font-face {

    font-family: Montserrat-Medium;

    src: url('../fonts/montserrat/Montserrat-Medium.ttf'); 

  }



  .modal-dialog {

      width: 960px;

      margin: 30px auto;

      /* position: absolute; */

      left: 0;

      right: 0;

      margin: auto;

      top: 0;

      bottom: 0;

      transform: translate(0, 0);

  }

  .form-group.form-group-set select {
    color: #f7a780 !important;
  }


  .modal-content {

      position: relative;

      display: -webkit-box;

      display: -ms-flexbox;

      display: flex;

      -webkit-box-orient: vertical;

      -webkit-box-direction: normal;

      -ms-flex-direction: column;

      flex-direction: column;

      width: 100%;

      pointer-events: auto;

      background-color: transparent;

      background-clip: padding-box;

      border: 0;

      border-radius: 0;

      outline: 0;

      -webkit-box-shadow: 0 0 0 transparent;

      box-shadow: 0 0 0 transparent;

  }



  /*//////////////////////////////////////////////////////////////////

  [ RESTYLE TAG ]*/



  /** {

    margin: 0px; 

    padding: 0px; 

    box-sizing: border-box;

  }*/



  /*body, html {

    height: 100%;

    font-family: Montserrat-Regular, sans-serif;

  }*/



  /*---------------------------------------------*/

  #myModal a {

    font-family: Montserrat-Regular;

    font-size: 14px;

    line-height: 1.7;

    color: #666666;

    margin: 0px;

    transition: all 0.4s;

    -webkit-transition: all 0.4s;

    -o-transition: all 0.4s;

    -moz-transition: all 0.4s;

  }



  #myModal a:focus {

    outline: none !important;

  }



  #myModal a:hover {

    text-decoration: none;

    color: #57b846;

  }



  /*---------------------------------------------*/

  #myModal h1,#myModal h2,#myModal h3,#myModal h4,#myModal h5,#myModal h6 {

    margin: 0px;

  }



  #myModal p {

    font-family: Montserrat-Regular;

    font-size: 14px;

    line-height: 1.7;

    color: #666666;

    margin: 0px;

  }



  #myModal ul, #myModal li {

    margin: 0px;

    list-style-type: none;

  }





  /*---------------------------------------------*/

  #myModal input {

    outline: none;

    border: none;

  }



  #myModal textarea {

    outline: none;

    border: none;

  }



  #myModal textarea:focus, #myModal input:focus {

    border-color: transparent !important;

  }



  #myModal input:focus::-webkit-input-placeholder { color:transparent; }

  #myModal input:focus:-moz-placeholder { color:transparent; }

  #myModal input:focus::-moz-placeholder { color:transparent; }

  #myModal input:focus:-ms-input-placeholder { color:transparent; }



  #myModal textarea:focus::-webkit-input-placeholder { color:transparent; }

  #myModal textarea:focus:-moz-placeholder { color:transparent; }

  #myModal textarea:focus::-moz-placeholder { color:transparent; }

  #myModal textarea:focus:-ms-input-placeholder { color:transparent; }



  #myModal input::-webkit-input-placeholder { color: #aaaaaa; }

  #myModal input:-moz-placeholder { color: #aaaaaa; }

  #myModal input::-moz-placeholder { color: #aaaaaa; }

  #myModal input:-ms-input-placeholder { color: #aaaaaa; }



  #myModal textarea::-webkit-input-placeholder { color: #aaaaaa; }

  #myModal textarea:-moz-placeholder { color: #aaaaaa; }

  #myModal textarea::-moz-placeholder { color: #aaaaaa; }

  #myModal #myModal textarea:-ms-input-placeholder { color: #aaaaaa; }



  /*---------------------------------------------*/

  #myModal .close {

      outline: none !important;

      border: none;

      background: transparent;

      /*position: relative;*/

      position:absolute;

      z-index: 9999;

      display: block;

      top: 15px;

      width: auto;

      margin: 0 auto;

      border: 1px soli;

      /*left: 485px;*/

      right: 0;

      opacity: 1;

      text-shadow: 0 0 0 transparent;

      color: #fff;

      border: none;

      /* width: 100%; */

      /* background-color: #2c292a; */

      /* height: 56px; */

  }

  #myModal button {

      outline: none !important;

      border: none;

      background: transparent;

      position: relative;

      z-index: 9999;

      display: block;

      width: 79%;

      margin: 0 auto;



  }

  #myModal button:hover {

    cursor: pointer;

  }



  #myModal iframe {

    border: none !important;

  }









  /*//////////////////////////////////////////////////////////////////

  [ Contact ]*/



  #myModal .bg-contact100 {

    width: 100%;  

    background-repeat: no-repeat;

    background-position: center center;

    background-size: cover;

  }



  #myModal .container-contact100 {

    width: 100%;

    min-height: 100%;

    display: -webkit-box;

    display: -webkit-flex;

    display: -moz-box;

    display: -ms-flexbox;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    align-items: center;

    padding: 15px;

    background: transparent;

  }



  #myModal .wrap-contact100 {

      width: 830px;

      background: #fff;

      border-radius: 10px;

      overflow: hidden;

      display: -webkit-box;

      display: -webkit-flex;

      display: -moz-box;

      display: -ms-flexbox;

      display: flex;

      flex-wrap: wrap;

      justify-content: space-between;

      padding: 55px 65px 0px 0px;

      position:relative;

  }



  /*------------------------------------------------------------------

  [  ]*/

  #myModal .contact100-pic {

    width: 310px;

    padding-top: 55px;

  }



  .contact100-pic img {

    max-width: 100%;

  }





  /*------------------------------------------------------------------

  [  ]*/



  .contact100-pic11.js-tilt11 img {

      width: 360px;

      margin: 0 0 0 -20px;

  }

  #myModal .contact100-form {

    width: 390px;

    padding-top: 30px;

  }



  #myModal .contact100-form-title {

    display: block;

    /* font-family: Montserrat-Regular; */

    font-size: 44px;

    color: #000000;

    line-height: 1.2;

    text-align: left;

    padding-bottom: 15px;

    font-weight: 700;

    margin: 0;

    text-transform: uppercase;

  }



  #myModal input.input100 {

      height: 50px;

      border-radius: 4px;

      padding: 0 30px 0 60px;

  }

  /*

  #myModal input.input100[name="email"] {

    padding: 0 30px 0 54px;

  }*/



  #myModal textarea.input100 {

    min-height: 150px;

    border-radius: 4px;

    padding: 14px 56px;

  }

  .envelope-icon i {
    position: absolute;
    top: 17px;
    right: 343px;
  }





  /*---------------------------------------------*/

  #myModal .wrap-input100 {

    position: relative;

    width: 100%;

    z-index: 1;

    margin-bottom: 10px;

  }



  #myModal .input100 {

    display: block;

    width: 100%;

    background: #e6e6e6;

    font-family: Montserrat-Regular;

    font-size: 15px;

    line-height: 1.5;

    color: #666666;

  }





  /*------------------------------------------------------------------

  [ Focus ]*/

  #myModal .focus-input100 {

    display: block;

    position: absolute;

    border-radius: 25px;

    bottom: 0;

    left: 0;

    z-index: -1;

    width: 100%;

    height: 100%;

    box-shadow: 0px 0px 0px 0px;

    color: rgba(255, 187, 102, 0.42);

  }



  #myModal .input100:focus + .focus-input100 {

    -webkit-animation: anim-shadow 0.5s ease-in-out forwards;

    animation: anim-shadow 0.5s ease-in-out forwards;

  }



  @-webkit-keyframes anim-shadow {

    to {

      box-shadow: 0px 0px 60px 25px;

      opacity: 0;

    }

  }



  @keyframes anim-shadow {

    to {

      box-shadow: 0px 0px 60px 25px;

      opacity: 0;

    }

  }



  #myModal .symbol-input100 {

    display: -webkit-box;

    display: -webkit-flex;

    display: -moz-box;

    display: -ms-flexbox;

    display: flex;

    align-items: center;

    position: absolute;

    border-radius: 25px;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 100%;

    padding-left: 30px;

    pointer-events: none;

    color: #aaaaaa;

    font-size: 15px;



    -webkit-transition: all 0.4s;

    -o-transition: all 0.4s;

    -moz-transition: all 0.4s;

    transition: all 0.4s;

  }



  #myModal .input100:focus + .focus-input100 + .symbol-input100 {

    color: #846add;

    padding-left: 22px;

  }



  /*------------------------------------------------------------------

  [ Button ]*/

  #myModal .container-contact100-form-btn {

    width: 100%;

    display: -webkit-box;

    display: -webkit-flex;

    display: -moz-box;

    display: -ms-flexbox;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    padding-top: 20px;

  }

  input::-webkit-outer-spin-button,

  input::-webkit-inner-spin-button {

      /* display: none; <- Crashes Chrome on hover */

      -webkit-appearance: none;

      margin: 0; /* <-- Apparently some margin are still there even though it's hidden */

  }



  input[type=number] {

      -moz-appearance:textfield; /* Firefox */

  }



  #myModal .contact100-form-btn {

    width: 100%;

    height: 50px;

    border-radius: 4px;

    background: #ffbb00;

    font-family: Montserrat-Regular;

    font-size: 15px;

    line-height: 1.5;

    color: #fff;

    display: -webkit-box;

    display: -webkit-flex;

    display: -moz-box;

    display: -ms-flexbox;

    display: flex;

    justify-content: center;

    align-items: center;

    padding: 0 25px;

    -webkit-transition: all 0.4s;

    -o-transition: all 0.4s;

    -moz-transition: all 0.4s;

    transition: all 0.4s;

  }



  #myModal .contact100-form-btn:hover {

    background: #000;

    color: #fb0;

  }



  /*------------------------------------------------------------------

  [ Responsive ]*/



  @media (max-width: 1366px) {
    #myModal .container-contact100 {
    padding-top: 0;
    padding-bottom: 0;
}

#myModal .wrap-contact100 {
    padding-top: 0;
}

#myModal .contact100-form {
    padding-top: 75px;
}
  }
  @media (max-width: 1200px) {

    #myModal .contact100-pic {

      width: 33.5%;

    }



    #myModal .contact100-form {

      width: 44%;

    }

  }



  @media (max-width: 992px) {

    #myModal .wrap-contact100 {

      padding: 110px 80px 157px 90px;

    }



    #myModal .contact100-pic {

      width: 35%;

    }



    #myModal .contact100-form {

      width: 55%;

    }

  }



  @media (max-width: 768px) {

    #myModal .wrap-contact100 {

      padding: 110px 80px 157px 80px;

    }



    #myModal .contact100-pic {

      display: none;

    }



    #myModal .contact100-form {

      width: 100%;

    }

  }



  @media (max-width: 767px) {

    #myModal .wrap-contact100 {

      padding: 110px 15px 157px 15px;

    }



      #myModal .wrap-contact100 {

        padding: 50px 15px 50px 15px;

    }



    .modal-dialog {

      width: 370px;

      margin: 30px auto;

      /* position: absolute; */

      left: 0;

      right: 0;

      margin: auto;

      top: 0;

      bottom: 0;

      transform: translate(0, 0);

  }

  }





  /*------------------------------------------------------------------

  [ Alert validate ]*/



  #myModal .validate-input {

    position: relative;

  }



  #myModal .alert-validate::before {

    content: attr(data-validate);

    position: absolute;

    max-width: 70%;

    background-color: white;

    border: 1px solid #c80000;

    border-radius: 13px;

    padding: 4px 25px 4px 10px;

    top: 50%;

    -webkit-transform: translateY(-50%);

    -moz-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    -o-transform: translateY(-50%);

    transform: translateY(-50%);

    right: 8px;

    pointer-events: none;



    font-family: Montserrat-Medium;

    color: #c80000;

    font-size: 13px;

    line-height: 1.4;

    text-align: left;



    visibility: hidden;

    opacity: 0;



    -webkit-transition: opacity 0.4s;

    -o-transition: opacity 0.4s;

    -moz-transition: opacity 0.4s;

    transition: opacity 0.4s;

  }



  #myModal .alert-validate::after {

    content: "\f06a";

    font-family: FontAwesome;

    display: block;

    position: absolute;

    color: #c80000;

    font-size: 15px;

    top: 50%;

    -webkit-transform: translateY(-50%);

    -moz-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    -o-transform: translateY(-50%);

    transform: translateY(-50%);

    right: 13px;

  }



  #myModal .alert-validate:hover:before {

    visibility: visible;

    opacity: 1;

  }



  @media (max-width: 992px) {

    #myModal .alert-validate::before {

      visibility: visible;

      opacity: 1;

    }

  }







  .close:after {

      content: "\f00d";

      font: normal normal normal 14px/1 FontAwesome;

      color: #fff;

      border: 0;

      box-shadow: 0 0 0 0 transparent;

      outline: 0;

      /* top: 175px; */

      display: block;

      /* position: relative; */

      /* display: flex; */

      /* align-items: center; */

      float: right;

      /* justify-content: center; */

      bottom: 0;

      z-index: 9999999999999999999999999999;

      /* width: 30%; */

      border: 0px solid;

      font-size: 20px;

      border-radius: 60px;

      height: 30px;

      width: 30px;

      padding-top: 5px;

      background: #af2b2b;

      margin: 0 20px 0 0px;

  }



  .modal {

      position: fixed;

      top: 0;

      right: 0;

      bottom: 0;

      left: 0;

      z-index: 1050;

      display: none;

      overflow: hidden;

      -webkit-overflow-scrolling: touch;

      outline: 0;

      background-color: rgba(0, 0, 0, 0.7);

      margin: auto;

      width: 100%;

  }



  .popup_head_mm {

    background-color: #2c292a;

    /* position: relative; */

    width: 100%;

    height: 60px;

    position: absolute;

    top: 0;

    border-radius: 0px;

}



.popup_head_mm_box1 {

    position: absolute;

    width: 28px;

    height: 28px;

    background-color: #efa835;

    border-radius: 50px;

    right: 62px;

    top: 15px;

}



.popup_head_mm_box2 {

    position: absolute;

    width: 28px;

    height: 28px;

    background-color: #43dd55;

    border-radius: 50px;

    right: 102px;

    top: 15px;

}





@media(max-width: 767px){

  .contact100-pic11.js-tilt11 img {

      display: none;

  }



  #myModal .contact100-form-title {

    text-align: center;

    font-size: 34px;

  }

#myModal .container-contact100 {
    width: 100%;
    padding: 15px 15px 15px 0px;
    margin: auto 0;
}


  .popup_head_mm {

    width: 100%;

    left: 0;

  }



  #myModal input.input100 {

    height: 40px;

    border-radius: 4px;

    padding: 0 30px 0 60px;

  }



  #myModal textarea.input100 {

    min-height: 100px;

    border-radius: 4px;

    padding: 14px 30px;

  }



  #myModal .wrap-contact100 {

    padding: 50px 15px 20px 15px;

  }

}