/*
 Theme Name:   ondamarina Theme
 Theme URI:     
 Description:   
 Author:        
 Author URI:    
 Template:     generatepress
 Version:      0.1
*/

/***pulse icon****/
.call-us {
  position: fixed;
  bottom: 2em;
  right: 2em;
  z-index: 3;
 /* top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); */
}
.call-us .icon img{
  margin-top: 7px !important;
  padding: 4px !important;  
} 
.icon {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: #FFF;
  border-radius: 50%;
  text-align: center;
  font-size: 30px;
  cursor: pointer;
  color: #000;
  line-height: 45px;
  border: solid 3px #2c5527;
}

.icon:after {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  content: '';
  box-shadow: inset 0 0 0 3px #2c5527;
  transition: transform 0.2s, opacity 0.2s;
}

.icon:hover:after {
  transform: scale(2.45);
  opacity: 0.8;
}

.pulsing:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  content: '';
  box-shadow: inset 0 0 0 3px #2c5527;
  transition: transform 0.2s, opacity 0.2s;
  animation: pulsing 2.7s infinite;
}

@keyframes pulsing {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(2);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 0;
  }
}



/** contact modal **/
.modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    opacity: 0;
    visibility: hidden;
    transform: scale(1.1);
    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
    z-index: 999;
}
.modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    color: #2c5527;
    width: 44rem;
    border-radius: 2px;
    border: solid 5px #f5f7fa;
    z-index: 4;
}
.modal-inner {
    position: relative;
    padding: 1rem 1.5rem;
}
.close-button {
    position: absolute;
    width: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    cursor: pointer;
    border-radius: 50%;
    background-color: #2c5527;
    right: -10px;
    top: -10px;
    color: white;
    font-weight: bold;
}
.close-button:hover {
    background-color: #867340;
}
.show-modal {
    opacity: 1;
    visibility: visible;
    transform: scale(1.0);
    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
}

/**wpcf7**/
.wpcf7 input, .wpcf7 textarea{
    border: solid 1px #2c5527;
    width: 100%;
}
.modal .wpcf7 input{
    width: auto;
}

@media (max-width: 768px) {
    .ptable .col,   .modal .wpcf7 input{
    width: 100%;
    }
    .ptable .col {
      margin: .5em 0;
    }
    .rowt.ptable{
        display: initial;
    }
    .modal .double{
        text-align: left;
        padding: 0 1em;
        font-size: 1.5rem;
        line-height: 1.6rem;
    }
    .modal input{
        width: 100%;
    }
    .modal-content{
        width: 95%;
    }
    .mhide {
        display:none !important;
    }
    .js_slide .col{
        width: 100%;
        padding: 10%;
    }
    .ticons {
        line-height: 20px;
        margin-left: 12%;
        }
    .ticons img {
        left: -24px;
        width: 20px;
    }
    .btn {
        font-size: .9em;
        line-height: 1.4em;
        padding: .7em 1em .5em;
        display: inline-block;
    }   
    .btn.gold-bg:before {
        right: -32px;
        line-height: .5em;
    }   
    .b-thumb h1{
        font-size: 2.1em;
    }
    .b-thumb .b-txt{
        font-size: .6em;
        line-height: 1.2em;
    }
    .title-box h2, .title-box h1 {
        font-size: 1.6em;
        line-height: 1.4em;
        padding-top: .5em;
        padding-bottom: .5em;
        }
}   

button.btn.gold-bg.pop_trigger {
    margin-left: -20px;
}

@media (min-width: 1200px) {
    .modal-inner {
        padding: 3rem;
    }
}
